.ctct-form-flyout.form_1 .ctct-form-defaults {
background: url(https://eu.evocdn.io/dealer/1022/content/media/cossignup25.png) no-repeat center
}

div.customertools .customertools-container {
    background: #f8f8f8
}

.users .input-group-addon:first-child {
    color: #454545
}

.myaccount #erpGridVue .no-more-tables thead,
.myaccount #gridvue .no-more-tables thead,
.myaccount #gridvue2 .no-more-tables thead,
.myaccount #gridvueCylinders .no-more-tables thead,
.myaccount #gridvuemultisearch .no-more-tables thead,
.myaccount #userordergridvue .no-more-tables thead {
    background: linear-gradient(
        58deg,
        #4797ce 0%,
        #3dbbbb 20%,
        #3dbbbb 80%,
        #4797ce 100%
    )
}

#gridvue .form-control,
#gridvue .select2-selection--single {
    background: #ffffff
}

.myaccount table {
    background: #ffffff
}

#cdash_address .with-padding-trl {
    background-color: #f7f7f9
}

#cdash_myinfo .big-image-bk i:before {
content: "\f007"
}
div.customertools .nav li.group-name  {
color: #454545
}
.ctct-flyout-top-center {
margin-top: 100px
}

.shoppingtools_container .account-btn {
max-height: 42px;
min-height: 42px
}

.ctct-banner-content div.ctct-form-defaults  {
padding: 20px 0
}

button.ctct-form-button.ctct-submit-inline.ctct-submit-inline-default.ctct-submit-inline-visible {
background: #3dbbbb ! Important
}

button.ctct-form-button.ctct-submit-inline.ctct-submit-inline-default.ctct-submit-inline-visible:hover {
background: #049acf ! Important
}

.shoppingtools_container .account-dropdown .description {
display: none
}

.dropdown-menu span.overlap {
width: 320px
}

.toolbar .account-dropdown .arrow_box:after, .toolbar .account-dropdown .arrow_box:before {
border-bottom-color: transparent
}

.griditems .btn-list {
border-radius: 5px;
transition: .40s all;
padding: 8px
}

.owl-carousel .tile .footer .price-label:before  {
display:none!important
}

.catalog-single .productsrelated .tile .footer span.uom.uomblock  {
display:none
}

.has-carousel .tile .footer .product-name   {
min-height: 50px!important;
max-height: 50px!important;
overflow: hidden;
font-size: .8em
}

.product-shopping-actions-prices span.uom.uomblock  {
color: #1b507a!Important;
font-size: .4em
}

@media only screen and (max-width: 768px){
.catalog-grid .tile .price-label {
font-size: 28px!Important
} }

@media only screen and (max-width: 767px) {
.catalog-single .product-summary  {
background: white;
padding: 5px;
border: 1px solid #e6e6e6 !important;
border-radius: 10px
} 

.catalog-single .softgraybackground, .softgraybackground {
border: 1px solid #e6e6e6!important
} }

.footersection-1 .nFlex{
    flex-wrap:wrap;
    align-items:flex-start
}

a.fReadMore{
    padding-top:5px;
    padding-bottom:5px
}

@media only screen and (max-width: 932px) {
    .footSocial a{
        flex-direction:column
    }
    .footSocial img{
        margin-bottom:15px
    }
    .footSocial p{
        text-align:center
    }
}

@media only screen and (max-width: 768px) {
    footer .contacts i.fa.fa-phone, footer .contacts i.fa.fa-envelope{
        margin:0 !important
    }
    .footSocial{
        justify-content:space-evenly !important
    }
    .footSocial a{
        width:100px
    }
}

.inktonerfinderwidget .select2-container{max-width:100%}
.indicators-grid{min-height:25px;max-height:25px}

.item-merchandising h3,
.products-related h3 {
    margin-left: 5px;
    margin-right: 5px;
    margin-top: 5px;
    background: linear-gradient(
        to bottom,
        #ffffff 0%,
        #f1f1f1 50%,
        #e1e1e1 51%,
        #f6f6f6 100%
    );
    border-radius: 0;
    padding: 5px 15px;
    font-weight: 400;
    color: #1b1a1a;
    border: 1px solid #9e9e9e
}

@media screen and (min-width: 100px) and (max-width: 360px) {
    .catalog-grid .tile .footer .footer-wrapper-price {
        margin-left: 7px;
        margin-right: 7px
    }
}

.maradjcc{margin-bottom:20px}
.toolbar .account-btn .user-icon{font-size:0;padding-bottom:0;margin-right:5px}
i.material-icons.user-icon::before{content:"\f007";font:normal normal normal 14px/1 FontAwesome;font-size:34px;display:inline-block}
.cart-dropdown .cart-resume .promotion_discount .coupon_apply:focus{background:#7c8e9a;color: #000000}
.footer-wrapper .product-sku{width:100%}
.fa-money-non-taxable:before{font-size:1.8em}
.fa-retweet:before{display:none}
@media only screen and (max-width: 768px) {
.indicators-grid{height:15px!important}
}
@media only screen and (min-width: 768px) {
.product-sku{width:65%}
}

.catalog-single .product-points .product-points-show-more{text-decoration:none;font-weight:700}
.list-attribute.product-stock .in-stock {
    color: #60af05;
    font-weight: 500;
    font-size: 1.2em
}

.fa-cloud-download:before{display:none}
.catalog-single .arrow-down{border-top:10px solid #1b507a;margin-top:4px;display:none}
.catalog-grid .tile .footer span.has-vat-price{color:#000000;font-weight: 400; margin-right: 2px}

@keyframes bounceIn {
0%{transform:scale(0.1);opacity:0}
60%{transform:scale(1.15);opacity:1}
100%{transform:scale(1)}
}

@keyframes fadeinnd {
    from {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.hSocial img{border-radius:2px;background:#1b78c7;transition:.25s all;margin-right:10px;width: 30px}
.headSocial{margin-left:20px}
a.hSocial:hover img{background:#ffc000}
.htw img{background:#00bff3}
.hin img{background:#1b78c7}
.hsText{display:inline-block;vertical-align:middle;font-size:16px;font-weight:700;line-height:16px}
.hsText span{font-weight:400;font-size:12px}
.header-full p.hcText{font-size:15px;text-align:right;line-height:19px;padding-right:15px}
.header-full p.hcText a{font-weight:700;color:#93d7ff}
.header-full p.hcText a.hEmail{color:#fff;font-size:12px;font-weight:400}
.header-full p.hcText a:hover{text-decoration:underline}
.headersection-2 .row-2{margin:auto}
.header-full .row-1 .cmspages_container{text-transform:uppercase}
.header-full .row-1 .cmspages_container a:hover{text-decoration:underline}
.header-full .row-1 .social{height:2em}
.header-full .row-1 .social-icons{position:relative;left:20px}
.header-full .row-1 .social-icons:hover{margin:3px -4px!important;transition:.3s}
.header-full .row-1 ul.classlinkslist{margin-left:13px}
.header-full p .cos-contact-number-header{color:#f5ff69;background:#ff0;font-weight:700;padding:2px 5px;border-radius:3px;margin-left:2px}
@media (min-width: 1200px) {
.headersection-2 .row-2{width:1180px}
}
@media (max-width: 1366px) {
.headersection-2 .row-2{width:100%}
}
@media (min-width: 1470px) {
.headersection-2 .row-2{width:1450px}
}
.toolbar .account-btn span .welcome-message{display:inline-block}
header section.search .search-form .form-group input{height:30px}

.cos-mainlinktext{color:#000;font-weight:700;text-transform:uppercase;margin-top:calc(.9vw + .9vh)}
@media (min-width: 1470px) {
.cos-mainlinktext{font-size:calc(.6vw + .6vh)}
}
@media (max-width: 425px) {
.cos-mainlinktext{font-size:3vw}
}
.cos-mainlinks .container>div.row{margin-top:3.2vh;margin-bottom:3.2vh}
.cos-mainlinks-item:hover .cos-mainlinktext{text-decoration:underline}
.catalog-grid .tile .product-name{font-weight:300}
.subscr-widget p.p-style2{color:#0f7ab2}
footer .copyright_container {
text-align: center
}

footer .copyright_container p {
margin: 25px 0;
font-weight: 600
}

footer .contacts {
margin-top: 0
}

footer {
padding: 0
}

footer a:focus {
color: #fff
}

footer .logo {
padding-bottom: 0
}

footer .row {
padding-bottom: 0
}

@media (min-width: 768px) {
    footer .menulinks_container ul {
        margin: 0;
        position: relative
    }

footer .menulinks_container ul li:last-child {
border-bottom: 0
} }

footer .dealerdetails_container a:hover {
text-decoration: none
}

footer .dealerdetails_container a.readmore {
margin-top: 1em;
display: inline-block
}

footer .dealerdetails_container a.readmore:before {
content: "\f138";
font-family: "FontAwesome";
margin-right: 10px
}

footer .contacts div.contact-block:first-child .contact-icon {
display: none
}

footer .contacts .contact-element.contact-icon {
display: block;
font-size: 1em
}

footer .contacts i.fa.fa-phone {
color: #049af3;
font-size: 1.5em;
margin-right: 10px
}

footer .contacts i.fa.fa-envelope {
color: #049af3;
font-size: 1.1em;
margin-right: 10px
}

footer .contacts .contact-block {
margin: 10px 0
}

.filters_container {
margin-top: 0
}

.shop-filters .showhide-indicator{color:#0f7ab2}
.inktonerfinder_wrapper{background-color:#2c3949}
.inktonerfinderwidget .btn{background:#1b507a}
.catalog-single.has-carousel .tile .buttons.group .addtoquicklist-wrapper{display:none}

@media only screen and (max-width: 768px) {
.catalog-grid .tile .footer div.rrp{width:100%!important}
}
.btn{margin-right:0}
.griditems .btn-list{vertical-align:top}
.fa-cosfav::before{content:"\f08a";color:#e91e63;font-size:21px;border:1px solid;border-color:#0f7ab2;border-radius:5px;padding:6px;display:inline-block;width:35px;height:35px}
.fa-cosfav:hover:before{content:"\f004";font-size:21px;border:1px solid;border-color:#0f7ab2;border-radius:5px;padding:6px;display:inline-block;width:35px;height:35px}
@media only screen and (max-width: 1475px) {
.catalog-grid .tile .footer .btn-primary{font-size:.8rem;width: 80%}
}
.catalog-grid #list .product-shopping-actions .product-shopping-actions-prices .price{width:55%}
.catalog-grid #list .product-shopping-actions .product-shopping-actions-prices .rrp{display:none}

@media screen and (min-width: 769px) {
.catalog-grid #list.productgridfull .list-attribute{margin:.2em 0 1em}
}

.inkselectform .select2-selection__rendered {
font-size: 1rem
}

.inktonerfinderwidget[data-layout='Horizontal'] .inktonerfinder_wrapper {
background: url(https://eu.evocdn.io/dealer/1022/content/media/inkbk25.png) !Important;
box-shadow: 1px 1px 2px #949494
}

.sidebar-content{background-color:#fff}
@media only screen and (max-width: 768px) {
h1,.h1{font-size:1.5em}

.modal-content{background-color:#fff!important}
}

.shopping-cart table td.qnt-count .form-control{border-radius:5px}
.shopping-cart table td.qnt-count .incr-btn{display: inline-block;
    background: #ffffff!important;
    color: #222;
    text-align: center;
    font-weight: 400;
    transition: background .3s;
    width: 25px;
    height: 25px;
    font-size: 1.2em;
    margin-top: 7px;
    line-height: 25px;
    border-radius: 0;
    border: 1px solid}

.catalog-grid .tile .footer .footer-wrapper-price{padding: 10px}

.shopping-cart table td.delete .delete-btn{border-radius:8px}
.shopping-cart #userformedit{margin-bottom:5px}
/* Phase 27: removed redundant header search input text colour (later #111 rule wins). */

.catalog-single .softgraybackground,.softgraybackground{background:#fafafa}
.catalog-single .product-points .product-points-show-more{text-align:left}
@media only screen and (max-width: 768px) {
.productquickview p{font-size:14px}
}
.productquickview .catalog-single .group-focus,.rating-num{display:none}
.modal-grid .productquickview.modal-content{
    padding:10px 65px;
    border:3px solid #607d8b;
    border-radius:5px;
    box-shadow:inset 2px 2px #9e9e9e;
    background-color:#fff
}
.productquickview .modal-body .close{color:#049af3}
.productquickview .arrow-up{margin-left:0;display:none}
.productquickview .product-image-quickview{max-height:500px}
.modal-grid .modal-body{font-size:.8em}
.productquickview .productdetails .brand-label{font-size:1em}
.modal-dialog h3{font-size:1.3em}
@media only screen and (max-width: 768px) {
.productquickview .product-image-quickview{border-right:0 solid!important;border-color:#fff!important;
max-height:250px!important}

.links-tab{border-bottom:0 solid #efefef!important}

.modal-grid .modal-body{font-size:.7em!important}

.modal-body,.modal-footer{padding:4px!important}
}

.tech-specs .item span{text-align:left;font-weight:300}
.tech-specs .item{padding:2px 10px}
input#searchlistwithin_hd,input#searchlist_hd,input#searchlistpanel_hd{border-radius:25px}
foot.signup{width:30%!important}
.remsmallbnmrg{margin-top:-75px!important;box-shadow:5px 5px 2px #949494!important}

.merchandising-carousel .owl-next,.merchandising-carousel .owl-prev{padding:5px;background:none;font-size:10px}
div#__lpform_olark-form-input-fname{display:none}
#mc_embed_signup{padding:0}
#mc_embed_signup input[type=email]{display:block;width:100%;height:35px;padding:6px 50px 6px 12px;font-size:1.2em;line-height:1.42857143;border-radius:5px;color:#2c3949;border:1px solid #0f7ab2}
#mc_embed_signup input[type=submit]{border-radius:5px}
.catalog-single .group-focus {
padding: 5px;
font-size: 1em;
color: #000;
margin-top: 10px;
border-radius: 0;
width: 80%;
margin-bottom: 10px;
white-space: nowrap;
text-overflow: ellipsis
}

.catalog-grid .group-focus{padding:10px;font-size:.9em;color:#c45500;border:solid .2em;border-color:#0f7ab2;border-radius:5px;box-shadow:inset 0 0 5px 0 #000}
.arrow_box{border:0 solid #4e5d6f}

.cart-dropdown table td{padding-bottom:12px;color:#3e3e3e}
.icon.icon-social{border-radius:5px}
@media (max-width: 767px) {
#mc_embed_signup input[type=email]{margin:auto}
}
.btn,.button,.ctct-form-button{font-weight:400;border-radius:5px}
.catalog-grid .softgraybackground{background-color:#e5f4fc}
.catalog-grid .product-name{font-size:.85em!Important}
.productsummary_container span.icons-together i.small{font-size:1.5em;margin:-3px}
.productsummary_container span.icons-together i.bigger{font-size:1.4em;color:red}
.price{font-weight:700}
.account-dropdown .pointer a{color:#1b507a}
.toolbar{right:15px;text-align:right;margin:0}
.cart-dropdown .footer .btn {
    font-weight: 700;
    font-size: 1.25em;
    border-radius: 0;
    text-transform: uppercase;
    background: #008080;
    padding: 10px 0;
    border: 1px solid #878787
}
.productaddtocart_container{margin-top:0}
.fa-bolt:before,.fa-flash:before{content:"\f017"}
.fa-list-alt:before{content:"\f0ca"}
.fa-trash-o:before{content:"\f00d"}
.btn-xs{font-size:small}
.catalog-single .rrp,.catalog-single .tile .footer span.rrp{vertical-align:baseline}
.footer h4{font-size:1.5em;margin-bottom:20px;letter-spacing:1px}
.floating-buttons{position:fixed;bottom:200px;right:25px;z-index:10}
.sm-links{font-size:.8rem;font-weight:300}
.cd-dropdown-trigger{line-height:36px}
.singlebanner_wrapper .banner_content .banner_button{margin-top:auto;margin-bottom:10px}
.nFlex,.footSocial,.footSocial a{display:flex;justify-content:space-between;align-items:center}
.footSocial img{transition:.25s;border-radius:3px;margin-right:0}
.footSocial .ffb img{background:#1b78c7}
.footSocial .ftw img{background:#00bff3}
.footSocial .fin img{background:#1b78c7}
.footer .footSocial a:hover img{background:#ffc000}
.footSocial p{font-size:14px;font-weight:600;line-height:16px;margin:0}
.footSocial p span{font-size:12px;font-weight:400}
footer{overflow:hidden}
.footc2a p{color:#fff;text-transform:uppercase;font-size:24px;line-height:24px;margin-left:20px;padding-bottom: 10px}
.footc2a p span{font-weight:900;line-height:19px}
.footc2a a{transition:.35s all;color:#fff;background:#01436b;font-size:13px;text-transform:uppercase;font-weight:900;border-radius:30px;padding:15px 60px;letter-spacing:1px;display:block;margin-top:30px;margin-right:20px}
.footc2a a:hover{background:#333;text-decoration:none}
a.fReadMore{background:url(https://eu.evocdn.io/dealer/1022/content/media/co-foot-arrow2_1.png) no-repeat scroll left center;padding-left:25px}
.toolbar .cart-btn:hover>.btn i{color:#fff}
@media (max-width: 767px) {
.pagination li{background-color:#fff}
}
.searchtools .close-panel{padding:6px}

@media (max-width: 767px) {
.merchandising-carousel .inner{padding-right:15px;padding-left:15px}

.catalog-grid .tile .product-name{margin-left:0!important;margin-right:0!important}
}
@media (max-width: 768px) {
.products-wrapper .result span{height:25px;line-height:25px}

.products-wrapper+.categories-wrapper{box-shadow:0 0;background-color:#f5f5f3}
}

@media (max-width: 768px) {
.ajax-results.open{margin-left:0!important}
}
@media (max-width: 320px) {
.btn-social{font-size:11px;letter-spacing:-.6px}
.modal-fullscreen.open{background-image:none;padding-top:0}
.brand-logo{max-height:45px;left:30px}
.payment-method-card label{font-size:9px}
.btn-social .icon{width:40px}
}

@media only screen and (min-width: 768px) {
.mobbanner{display:none}
}
@media only screen and (max-width: 768px) {
.inktonerfinder_wrapper{margin:0}
}
@media (max-width: 320px) {
select#productorderby{display:none}
}

@media (max-width: 767px) {
.col-xs-4{width:65%}
}
@media (max-width: 767px) {
.col-xs-8{width:35%;font-size:10px}
}
@media (max-width: 767px) {
.listtools .sortby span{display:none}
}

@media (max-width: 767px) {
.catalog-grid .price-label:before{font-size:21px!important}
}
@media only screen and (max-width: 320px) {
.label-danger{font-size:.7em!important}
}
@media only screen and (max-width: 768px) {
.label-danger{font-size:1em!important}
}

.mobdivider{height:5px;width:2px;background:#d0d0d0}
@media only screen and (max-width: 768px) {
.modal-grid .productquickview.modal-content{padding:0}
}

@media only screen and (max-width: 768px) {
.old-price{display:none}
}

@media only screen and (max-width: 768px) {
.fa-shopping-bag:before{display:none}
}
@media only screen and (max-width: 768px) {
.catalog-single .quick-product .productdetails button{border-radius:25px;width:58%}
}
@media only screen and (max-width: 768px) {
.catalog-single .product-shopping-actions{margin:5px auto .1em}
}

@media only screen and (max-width: 768px) {
.relationship-carousel .owl-next,.relationship-carousel .owl-prev{display:inline}
}
@media only screen and (max-width: 768px) {
.productimage_container .productimagesolo{padding:10px}
}

@media only screen and (max-width: 768px) {
.listtoolsbottom{border-top:0!important}
}
@media (max-width: 715px) {
    .toolbar .cart-btn > .btn {
        padding: 0 10px
    }
}
.fa-paper-plane:before,.fa-send:before{content:"\f015"}
.fa-home:before{content:"\f0e4"}
.fa-check:before{color:#3dbbbb}
.catalog-single{padding:1px}
.merchandising-carousel .inner{background-color:#fff;margin-bottom:20px}
.merchandising-carousel .owl-carousel .owl-stage-outer{background-color:#fff;margin-bottom:20px}
.footersection-2 .nFlex{align-items:start;flex-direction:column}
.nFoot1,.nFoot2,.nFoot3,.nFoot4{width:100%}

@media screen and (min-width: 769px) {
.footersection-2 .nFlex{flex-direction:row}
.nFoot1{width:20%}
.nFoot2{width:20%}
.nFoot3{width:20%}
.nFoot4{width:40%}
.footSocial{max-width:430px}
}
.footc2a a{margin-top:0;float:right}

h3.banner_subtitle{font-size:.8em!important;margin:2px}

.btn.btn-primary.btn-list.banner_button {
    padding: 5px
}
div#singlebanner_105494.singlebanner_container{font-size:15px}
thead{background:#f5f5f5}

.product-sku{color:#2c3949;margin-top:10px}
.fa-money-non-taxable{margin-top:0}
.singlebanner_wrapper{margin-top:0}
.menufixed{position:fixed;top:0;z-index:1000;width:100%}

@media (max-width: 768px) {
    #productCompareModal .modal-content {
        background-color: #fff !important
    }
}

.bottomshade {
    box-shadow: 0 10px 6px -6px #777 !important
}

@media only screen and (min-width: 769px) {
.cd-dropdown-content > li:hover > ul.cd-secondary-dropdown{background:#fff;background-image:url(https://eu.evocdn.io/dealer/1022/content/media/heretohelpyou.jpg);background-repeat:no-repeat;background-position-x:100%;background-position-y:100%}
}
.inktonerfinderwidget[data-widgetsize='1'] button{background-color:#fff;color:#1b507a}
.inktonerfinder_wrapper h5{font-size:1.3em}
.inktonerfinder_wrapper {border-radius: 5px!Important}
.brandmerchandising-carousel .inner{max-width:95%}
.inktonerfinderwidget[data-widgetsize='1']{font-size:.8em;max-width:100%;margin:5px 0 10px;width:100%}

@media (max-width: 768px) {
    footer .menulinks_container ul li {
        padding: .3em .3em .3em .5rem;
        width: 100%;
        border: 1px solid #fff
    }
}
@media (max-width: 768px) {
footer .footc2a a{width:80%;margin-left:10%;float:none}
}

.herobd {
    border-top: 2px solid #d9d9d9;
    border-bottom: 0
}
.arrow_box:after,.arrow_box:before{border-bottom-color:#fff}
@media only screen and (max-width: 768px) {
.hearbg{border:7px solid #f4f4f4}
}

.catalog-single .tile .product-name{min-height:76px!important;max-height:76px!important;overflow:hidden}
span.price-label-inc-vat{margin-top:0}

@media only screen and (max-width: 768px) {
.nav-pills>li{display:none}
}
ms-thumb-list.ms-dir-h{width:100%;border:1px solid #b3b3b3}

@media only screen and (max-width: 768px) {
.catalog-grid .tile .footer span.price-label-inc-vat{padding-bottom:3px;font-size: 14px}
}

@media only screen and (max-width: 768px) {
.catalog-grid .tile .footer span.uom.uomblock{margin-bottom:5px}
}
@media only screen and (max-width: 768px) {
.catalog-grid .tile .footer a{font-size:1em}
}
@media only screen and (max-width: 768px) {
.catalog-grid .tile .product-name{margin-left:25px;margin-right:25px}
}
@media only screen and (max-width: 768px) {
.indicators-grid{height:0}
}
@media only screen and (max-width: 768px) {
.in-stock{font-size:1em}
}
@media only screen and (max-width: 768px) {
.catalog-grid .price-label:before{font-size:32px;padding-top:10px}
}
@media only screen and (max-width: 768px) {
.catalog-grid .tile .price-label{font-size:2.5em}
}

.divquickview button.showquickview {
    transition: all .5s ease-out
}

@media only screen and (min-width: 769px) {
.cd-dropdown.dropdown-is-active{margin-top:-7px}
}

.catalog-single .quick-product .productdetails button{margin-bottom:0}

.header-full nav.menu .catalog-block .toolbar{position:absolute;top:7px;right:2em}
.dropdown-container-al{left:10px}
.singlebanner_wrapper{margin-bottom:0}
header section.search .search-form .form-group input{padding-right:0;padding-top:6px}
header section.search .search-form .form-group input[type=text]:focus{width:100%}
section.search .select2-container-multi .select2-choices{background-color:transparent}
.fa-shopping-bag:after{color:#049af3}
.relationship-carousel carousel-100793{border:1px solid #049af3}
.merchandising-carousel .owl-carousel .owl-stage-outer{margin-bottom:-10px!important;margin-top:10px;border:none}
.owl-carousel .owl-stage-outer{border-top:0;border-bottom:0}
.productquickview .catalog-single .buttons .ql-loginmsg,.productquickview .catalog-single .buttons .addtoquicklist{display:block}
.brandmerchandising-carousel .inner{margin-right:25px}
.listtools select,.toollistfixed select{color:#1b507a;background:#ffffff}
inktonerfinderwidget[data-widgetsize='1']{font-size:.8em;max-width:100%;border:7px double;border-color:#dcddde;border-radius:18px;margin:5px 0}
.cart-dropdown table.minicart tr{border-bottom: 10px solid #f5f5f5;background: #ffffff}
@media (min-width: 1470px) {
.header-full .headersection-3 p{width:256px}
}
@media (max-width: 1470px) {
.header-full .headersection-3 p{width:150px}
}
@media (max-width: 800px) {
.header-full .headersection-3 p{width:120px;font-size:14px}
}
@media (max-width: 1475px) {
.hEmail{display:none}
}

@media only screen and (max-width: 768px) {
.footc2a p{margin-left:25px;margin-right:25px;padding-bottom:10px}
}

@media only screen and (max-width: 768px) {
.nFlex,.footSocial,.footSocial a{margin-left:5px;margin-right:5px}
}
@media (min-width: 1024px) {
.footersection-2 .menulinks_container ul li{position:relative;width:80%; margin-bottom: 2px}
}

@media only screen and (max-width: 768px) {
.catalog-single .product-points ul li{font-size:.85em}
}
.shopping-cart table.items-list tr.gift td .gift-element{display:none}
.breadcrumb>.breadcrumb_home>a{color:#1b507a}
@media screen and (min-width: 769px) {
.catalog-grid .list-attribute.product-category{font-size:12px;margin-top:5px;margin-bottom:6px}
}
.catalog-grid #grid .divquickview{top:80%}
@media only screen and (min-width: 769px) {
body:not(.touch) .cd-dropdown-content>li.has-children>a{pointer-events:auto}
}
.cart-dropdown table td input:focus{background-color:#e5f4fc}
.shopping-actions .price span.has-price{background-color:transparent!important;color:#2196f3!important;font-weight:600;font-size:1.2em}
.catalog-grid .tile .price-label{line-height:1.2em;display:inline-block}

.quicklistsedit span.rrp:before,.contractitems span.rrp:before{content:"RRP:"}
.catalog-grid .divquickview button i,.catalog-single .divquickview button i{display:none}
.arrow-your-account{padding-bottom:2px}
@media only screen and (max-width: 768px) {
.shopping-cart table{padding:5px}
}

@media only screen and (min-width: 769px) and (max-width: 1024px) {
header section.search .search-form{margin-left:4em}
}

/* main content moved to dedicated css file */

.qty-list,
input.qty-list,
input.qty-list.form-control {
    display: inline-block;
    vertical-align: top;
    height: 40px;
    min-height: 40px;
    padding: 0 4px;
    margin: 0 4px 0 0;
    box-sizing: border-box;
    font-size: 16px;
    font-weight: 600;
    text-align: center;
    border: 1px solid #b5b5b5;
    border-radius: 5px;
    background: #ffffff;
    color: #10231d
}

.catalog-grid input.qty-list:focus {
        border-color: #008080;
        outline: 2px solid rgba(0,128,128,.15);
        outline-offset: 1px
}

.catalog-single .buttons .qnt-count{
padding-top: 0;
padding-bottom: 15px
}

.catalog-single .product-shopping-actions .product-stock {
display: flex;
text-align: center
}

.cart-dropdown .cart-resume .promotion_discount .coupon_apply  {
background-color: #3dbbbb;
font-weight: 700
}

.cart-dropdown .cart-resume .promotion_discount .coupon_apply:hover  {
background-color: #878787;
color: #fff
}

.cd-dropdown-trigger:after, .cd-dropdown-trigger:before {
background: #3dbbbb
}

.cd-dropdown-trigger {
padding: 0 38px 0 30px
}

@media only screen and (min-width: 1401px) {
.costelheader{
margin-left: 12px
} }

@media only screen and (max-width: 1400px) {
.costelheader{
margin-left: 5px
} }

.logged-in i.material-icons.user-icon::before{color:#878787}

.costelheader {
font-size: 12px;
color: #fff;
min-width: 200px
}

.costelheader1 {
color: #049af3;
margin-left: 40px;
font-size: 12px;
width: 100%
}

.footc2a p {
padding-bottom: 15px
 }

@media only screen and (min-width: 769px) {
.cd-dropdown-content .cd-secondary-dropdown > li > a {
font-size: 14px
} }

.btn-sm {
font-size: 1em;
border: 0
}

.catalog-single .product-shopping-actions .product-shopping-actions-addtocart button:hover{
border: 0
}

.catalog-single .product-shopping-actions .buttons.group .btn-add-to-cart {
margin: 0;
flex-grow: 1;
border-radius: 3px;
min-height: 40px;
font-weight: 600;
font-size: 1em;
transition: .35s all
}

#modalAddToCart .btn-outlined.btn-default:hover {
background: #3dbbbb
}

#modalAddToCart .btn-outlined.btn-default {
    color: #222;
    background: #9ce6ff;
    font-size: 1.3em;
    border: 1px solid #878787
}

#modalAddToCart .modal-title {
font-size: 1.4em;
color: #fff
}

#modalAddToCart .modalProductInfo{
font-size: 1.2em
}

#modalAddToCart .modal-content{
background:#f5f5f5
}

#productCompareModal .modal-body .btn-list{
width: 75%;
display: inline-block
}

#productCompareModal .modal-content .uom.uomblock {
font-size: 1em
}

#productCompareModal .modal-content{
background:#fff;
padding: 30px 45px !important
}

.owl-carousel .tile .footer{
padding: 5px;
border-top: 10px solid #ffffff
}

.catalog-grid .tile .footer  span.has-vat-price {
display: inline-block
}

.widget-lastviewedproducts-html .owl-carousel .owl-stage-outer .tile .buttons.group  {
display: none
}

@media screen and (min-width: 769px) {
.catalog-grid .tile .product-name {
    font-weight: 500;
    line-height: 1.45;

    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;

    overflow: hidden;
    height: calc(1.45em * 3)
}
}

@media screen and (max-width: 768px) {
.fa-star:before {
display:none
} }

.widget-lastviewedproducts-html .tile .footer .buttons.group {
margin-top: 43px
}

.widget-lastviewedproducts-html .owl-carousel .tile .footer .buttons.group {
padding-top: 4px;
margin-top: 0;
text-align: left!Important;
margin-left: 0
}

.widget-lastviewedproducts-html .tileparent span.live-inventory-v2-shipping.in-stock {
width: 100%
}

.shopping-cart .delete-btn {
height: 30px
}

.shopping-cart a.delete-btn {
line-height: 30px
}

.shopping-cart table img {
max-height: 100px
}

.shopping-cart table td.delete .delete-btn:hover {
background: #ffc8c8 !important;
color: #222
}

.shopping-cart table td.delete .delete-btn {
background: #efefef !important;
color: #222;
font-size: 14px
}

.shopping-cart table td.delete{
padding-right: 10px
}

#menulinks_107711.menulinks_container section.quicklinks ul li:before,
#menulinks_107712.menulinks_container section.quicklinks ul li:before,
#menulinks_101489.menulinks_container section.quicklinks ul li:before,
#menulinks_107682.menulinks_container section.quicklinks ul li:before,
#menulinks_101441.menulinks_container section.quicklinks ul li:before,
#menulinks_107829.menulinks_container section.quicklinks ul li:before {
    content: "\f0d9";
    font: normal normal normal 14px/1 FontAwesome;
    display: inline-block;
    margin-left: 5px;
    margin-right: 5px;
    color: #049af3
}
#menulinks_107711.menulinks_container section.quicklinks .title,
#menulinks_107712.menulinks_container section.quicklinks .title,
#menulinks_101489.menulinks_container section.quicklinks .title,
#menulinks_107682.menulinks_container section.quicklinks .title,
#menulinks_101441.menulinks_container section.quicklinks .title,
#menulinks_107829.menulinks_container section.quicklinks .title {
    text-transform: capitalize !important;
    margin-left: 15px;
    margin-right: 15px;
    border-top: 1px solid #049af3;
    padding-top: 15px
}

#menulinks_107708.menulinks_container section.quicklinks .title,
#menulinks_139149.menulinks_container section.quicklinks .title,
#menulinks_139150.menulinks_container section.quicklinks .title,
#menulinks_139075.menulinks_container section.quicklinks .title {
    text-transform: capitalize !important;
    margin-left: 15px;
    margin-right: 15px;
    padding-top: 15px;
    font-size: 14px
}

#menulinks_139149.menulinks_container section.quicklinks ul li:before {
    content: "\f006";
    font: normal normal normal 14px/1 FontAwesome;
    display: inline-block;
    margin-left: 5px;
    color: #ff5722;
    margin-right: 5px
}
#menulinks_139150.menulinks_container section.quicklinks ul li:before {
    content: "\f0d9";
    font: normal normal normal 14px/1 FontAwesome;
    display: inline-block;
    margin-left: 5px;
    color: #049af3;
    margin-right: 5px
}

#menulinks_155827.menulinks_container section.quicklinks .title,
#menulinks_155828.menulinks_container section.quicklinks .title,
#menulinks_139076.menulinks_container section.quicklinks .title {
    text-transform: capitalize !important;
    margin-left: 15px;
    margin-right: 15px;
    border-top: 1px solid #c6c6c6;
    padding-top: 15px;
    font-size: 14px
}

#menulinks_155827.menulinks_container section.quicklinks ul li:before {
content: "\f0d9";
    font: normal normal normal 14px/1 FontAwesome;
    display: inline-block;
    margin-left: 5px;
    color: #049af3;
    margin-right: 5px
}

#menulinks_155828.menulinks_container section.quicklinks ul li:before {
content: "\f006";
    font: normal normal normal 14px/1 FontAwesome;
    display: inline-block;
    margin-left: 5px;
    color: #ff5722;
    margin-right: 5px
}

#menulinks_139075.menulinks_container section.quicklinks ul li:before {
    content: "\f006";
    font: normal normal normal 14px/1 FontAwesome;
    display: inline-block;
    margin-left: 5px;
    color: #ff5722;
    margin-right: 5px
}
#menulinks_139076.menulinks_container section.quicklinks ul li:before {
    content: "\f0d9";
    font: normal normal normal 14px/1 FontAwesome;
    display: inline-block;
    margin-left: 5px;
    color: #049af3;
    margin-right: 5px
}

#menulinks_150296.menulinks_container section.quicklinks .title,
#menulinks_139147.menulinks_container section.quicklinks .title,
#menulinks_140453.menulinks_container section.quicklinks .title  {
text-transform: capitalize!Important;
margin-left: 15px;
border-top: 1px solid #c6c6c6;
margin-right: 15px;
padding-top: 15px
}

#menulinks_150297.menulinks_container section.quicklinks .title,
#menulinks_139148.menulinks_container section.quicklinks .title,
#menulinks_140452.menulinks_container section.quicklinks .title  {
text-transform: capitalize!Important;
margin-left: 15px;
border-top: 1px solid #c6c6c6;
margin-right: 15px;
padding-top: 15px
}

#menulinks_150296.menulinks_container section.quicklinks ul li:before,
#menulinks_139147.menulinks_container section.quicklinks ul li:before,
#menulinks_140453.menulinks_container section.quicklinks ul li:before {
    content: "\f006";
    font: normal normal normal 14px/1 FontAwesome;
    display: inline-block;
    margin-left: 5px;
    color: #ff5722;
    margin-right: 5px
}

#menulinks_150297.menulinks_container section.quicklinks ul li:before,
#menulinks_139148.menulinks_container section.quicklinks ul li:before,
#menulinks_140452.menulinks_container section.quicklinks ul li:before {
    content: "\f0d9";
    font: normal normal normal 14px/1 FontAwesome;
    display: inline-block;
    margin-left: 5px;
    color: #049af3;
    margin-right: 5px
}

.cart-dropdown .promotion_discount button i {
color: #fff
}

.cart-dropdown .header i.fa-shopping-bag {
margin-top: 5px;
vertical-align: bottom
}

.minicart img {
max-height: 60px
}

.cart-dropdown .footer  {
padding: 8px;
border-top: 1px solid #d8d8d8
}

.cart-dropdown .mini-shopping-cart {
padding: 0
}

.cart-dropdown .cart-search {
padding: 0 10px 15px
}

.cart-dropdown .cart-totals tr.devider td:first-child {
padding-bottom: 0
}

.mini-shopping-cart .cart-sidebar .cart-totals .devider+tr td {
font-size: 1em;
padding-top: 9px
}

.fa-trash-o:before {
content: "\f056"!Important;
color: red
}

.cart-dropdown table td input {
    border: 1px solid #9e9e9e;
    width: 40px
}

td.minicart_itemname {
padding-left: 5px
}

.cart-dropdown table.minicart td:first-child  {
width: 18%
}

.mini-shopping-cart .cart-totals {
padding: 10px;
background: #f5f5f5
}

.cart-dropdown  {
border: 2px solid #ffffff!important;
box-shadow: 0 0 8px #000000;
z-index: 100000;
top: 45px
}

.cart-dropdown .arrow_box .header.group {
background: #e6e6e6;
    font-size: 1.3rem;
    color: #000;
    padding: 7px 5px;
    font-weight: 900;
    text-align: center
}

.cart-dropdown .plus-minus  {
margin-top: 8px;
font-size: .8em
}

.fa-plus-square-o:before {
    content: "\f107"!important
}

.fa-minus-square-o:before {
content: "\f106"!important
}

.product-sku{
font-size: .70em!Important
}

.catalog-single.has-carousel.item-merchandising .tile .footer span.uom.uomblock, .uom.uomblock {
display: none
}

.catalog-single.has-carousel.item-merchandising .footer-wrapper .product-sku {
display: none
}

.catalog-single h3 {
color: #010202;
text-transform: uppercase;
    font-weight: 700;
    margin-left: 0
}

.shop-filters .more-options a {
    font-weight: bolder !important;
    gap: 4px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    color: #454545
}

.shop-filters .more-options a::before {
content: "Show"
}

.shop-filters .more-options a i {
order: 1
}

.shop-filters .more-options {
margin: 6px 0 0;
font-size: .95em;
font-weight: 400
}

.filters-mobile {
margin-bottom: 0
}

section.quicklinks ul {
    margin-bottom: .3em;
    color: #1b507a;
    font-weight: 300;
    margin-left: 0;
    padding: 5px;
    border-radius: 5px
}

.quicklinks-custom h4{
color: #292c2e;
font-size: .9em
}

.shop-filters {
margin-bottom: 0
}

.listtools select, .toollistfixed select {
padding: 5px 2px
}

.pagination li {
margin: 2px
}

.pagination li.active a {
    color: #fff;
    background: #3dbbbb;
    pointer-events: none;
    font-weight: 300;
    padding: 5px 10px;
    border-radius: 5px
}

.pagination li a {
    border: 1px solid #008080!Important;
    color: #3dbbbb;
    font-weight: 300;
    padding: 2px 10px;
    border-radius: 5px
}

.pagination li a:hover {
    color: #fff;
    background-color: #3dbbbb
}

.pagination>li:first-child>a, .pagination>li:first-child>span {
    border-bottom-left-radius: 5px;
    border-top-left-radius: 5px
}

.pagination > li:last-child > a {
    padding: 5px 10px;
    border-radius: 5px
}
.listtools select {
color: #008080;
    font-size: 14px;
    font-weight: 600;
    border: 1px solid #b2dfdb;
    border-radius: 6px
}

.widget-lastviewedproducts-html .divquickview button.showquickview{background-color:#f7f6f2;color:#696666;font-size:12px;font-weight:700}

.widget-lastviewedproducts-html .divquickview button.showquickview:hover{background-color:#f7f6f2;color:#1b507a;border:2px solid #049af3;font-size:.8em}

.widget-lastviewedproducts-html .tile .footer .btn-primary:before {
display: none!Important
}

.widget-lastviewedproducts-html .tile .footer .btn  {
width: 68%!Important
}

.widget-lastviewedproducts-html .product-stock {
padding: 0;
margin: 0;
min-height: 35px!important;
max-height: 35px!important;
text-align: left
}

.widget-lastviewedproducts-html .in-stock {
font-size: 1em;
float: left
}

.widget-lastviewedproducts-html .tile .footer .product-name>a {
white-space: normal
}

.widget-lastviewedproducts-html.has-carousel .tile .footer .product-name {
min-height: 60px!important;
max-height: 60px!important;
text-align: left
}

.widget-lastviewedproducts-html.has-carousel .tile .footer .indicators-grid {
display: none
}

 .widget-lastviewedproducts-html .owl-nav .owl-next, .widget-lastviewedproducts-html .owl-nav .owl-prev {
padding: 4px
}

.widget-lastviewedproducts-html .tileparent {
border-top: none;
width: 250px
}

.widget-lastviewedproducts-html .tile .footer  {
padding: 5px;
border-top: 10px solid #ffffff
}

.catalog-single .price:before {
text-transform: capitalize!Important
}

.catalog-single .social-links {
display: none
}

.btn.btn-list i  {
vertical-align: baseline;
font-size: 14px
}

.product-shopping-actions-prices .product-price-rrp  {
font-size: 12px
}

.catalog-single .arrow-down {
border-left: 10px solid transparent;
border-right: 10px solid transparent
}

.catalog-single .group-focus {
line-height: 1.8em
 }

@media only screen and (min-width: 770px){
.social-sign-in p:before{
font-size: 2em;
    content: "Please Login";
    display: block;
    font-weight: 700
} }

@media only screen and (min-width: 768px){
.buttons.group {
margin-bottom: 5px
} }

input.cmn-toggle-round-flat+label:after {
background-color: #333}

input.cmn-toggle-round-flat:checked + label:after{
background-color: #3dbbbb}

input.cmn-toggle-round-flat:checked+label, input.cmn-toggle-round-flat:checked+label:after {
background-color: #fff
}

.shop-filters .filter-section h5 {
margin-left: 0;
color: #222;
text-transform: none;
font-weight: 700
}

.shop-filters .filter-section.filtername-incontract h5, .shop-filters .filter-section.filtername-instock h5 {
max-width: 100%;
font-size: .9em;
text-transform: capitalize
}
.shop-filters .filter-section.filtername-instock h5:before {
content: "Display "
}

.shop-filters section.filter-section.filtername-instock, .shop-filters section.filter-section.filtername-incontract {
display: flex;
flex-direction: row-reverse;
justify-content: space-around;
align-items: center;
margin-top: 1em
}

.shop-filters .filter-section.filtername-incontract, .shop-filters .filter-section.filtername-instock {
padding: 5px;
background-color: #e6f7f7;
display: flex;
gap: 10px;
border-radius: 5px
}

.shop-filters .filter-section.filtername-incontract>div, .shop-filters .filter-section.filtername-instock>div {
order: -1
}

.shop-filters .showhide-indicator {
left: inherit;
right: 10px;
top: 10px;
font-weight: 400
}

@media only screen and (min-width: 770px){
.search-with-in {
    border-bottom: 1px solid #c6c6c6
} }

.shop-filters .filter-section .fa-minus-square:before{content:"\f107"!Important;color: #008080}
.shop-filters .filter-section .fa-plus-square:before{content:"\f104"!Important;color: #008080}

.shop-filters .filter-options a.active{font-weight:200;color:#1b507a}

.shop-filters .filter-options{margin-left:0!Important}

section.search.search-with-in .searchtoolsright {
text-align: left;
color: grey!Important
}

.shop-filters{border-radius:0}

.shop-filters .arrow-down {
    display: none;
    border-top: 10px solid #e6e6e6 !important;
    margin-bottom: 10px
}

.shop-filters .filter-options:hover  {
border-color: #049af3
}

section.search .searchtoolsright  {
margin-top: 15px
}

.shop-filters .remove-filter:hover{color:#c80000}

section.search-with-in.search.searchpills > div:nth-child(2)::before {
    content: "You Selected:";
    color: #292c2e;
    font-weight: 700;
    padding: 1px;
    font-size: 1em;
display:block
}

.shop-filters .filter-section h5:hover {
color: #008080
}

.menuitem.pointer>a:before{
background-color:#3dbbbb!important
}

.product-shopping-actions-prices span.uom.uomblock {
display: none
}

.ePoints{
    float:right;
    font-style:italic
}

.catalog-single.has-carousel {
margin-top: 5px
}

.lastviewedproducts_138955 .catalog-single .h3 {
margin-left: 15px
}

.catalog-single.has-carousel .brand-label {
    display: none
}

@media only screen and (max-width: 768px) {
.shopping-cart .cart-topbuttons .btn-media-full {
display:none!Important
} }

@media only screen and (max-width: 768px) {
body.ex-product .product-options .option-group{
text-align: left
} }

@media only screen and (max-width: 768px) {
.shopping-cart table td.delete .delete-btn {
Margin-Left: 30px
} }

@media only screen and (max-width: 768px) {
.shopping-cart .no-more-tables td:before {
font-weight: 400
} }

button.form-control.btn.btn-default.btn-sm.coupon_apply .fa {
display: inline
}

@media only screen and (max-width: 768px) {
.myMerchCart{
display:none!Important
} }

.COSCard {
    text-align: center;
    margin-top: 10px
}
.COSCard img {
    max-width: 250px
}

.CIBanner {
margin-top: 15px
}

.CIProductFeature a
{display:inline-block;font-size:12px;font-weight:700;padding:10px;margin-right:3px
}

.CSP p {
    font-size: 12px
}

.DSH p {
    max-width: 80%;
font-size: 12px
}

.DSH img {
    border: 1px solid #ddd;
    padding: 10px
}

.CIFeature {
font-size: 12px
}

.CIFeature li {
    margin-right: 15px
}

.CIProductFeature img {
border: 1px solid #ddd;
border-radius: 5px
}

.CIProductFeature {
padding: 5px;
margin-left: 20px;
text-align: left
}

#lastviewedproducts_138959 .tile .product-shopping-actions-tierpricing,
#lastviewedproducts_138964 .tile .product-shopping-actions-tierpricing {
    display: none
}
.tile .product-shopping-actions-tierpricing {
display: block
}

.additional-services {
border-top: 1px solid #ddd;
margin-bottom:15px
}

.BSH h3 {
font-size: 28px;
font-weight: 700
}

.BSP p {
font-size: 14px
}

.ASHC h3{
text-align: center;
    font-size: 18px;
    font-weight: 700;
    padding: 10px;
border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    margin-left: 15px;
    margin-right: 15px
}

.ASH h3 {
font-size: 16px;
font-weight: 700
}

.ASP p {
font-size: 12px
}

@media only screen and (min-width: 768px) {
.listtools  {
padding: 5px 10px;
background: #fafafa;
margin: 10px -15px
} }

.shop-filters i.fa-square-o:before {
display:none
}

@media only screen and (min-width: 450px){
section.search .search-form button[type=submit] {
top: 8px;
right: 7px
} }

.container.mainproductpagedesktop  {
box-shadow: none!Important
}

.romw-floating-layout .romw-review-block {
width: 180px!Important
}

#singlebanner_167377 .banner_button{
margin-bottom: 4%
}

#review-container .romw-button.romw-right {
    right: 0;
    top: 50%
}

.Cosest a{
color: #c1c1c1;
float: right;
margin-right: 0;
font-style: italic;
margin-top: 6px
}

#lastviewedproducts_164822  {
margin-bottom: 10px
}

@media only screen and (max-width: 768px) {
#lastviewedproducts_164822 .owl-carousel.owl-drag .owl-item .imgthumbnail  {
border: none
} }

@media only screen and (min-width: 769px) {
#lastviewedproducts_164822 .owl-carousel.owl-drag .owl-item .imgthumbnail  {
border: 1px solid #ccc;
background: white
} }

#lastviewedproducts_164822 .catalog-single.has-carousel .tile, .catalog-single.has-grid .tile  {
border: 0;
border-right: 1px solid #efefef!Important
}

#lastviewedproducts_164822 .widget-contract-items-html .tile .footer, .widget-lastviewedproducts-html .tile .footer  {
min-height: auto
}

#lastviewedproducts_164822 .widget-lastviewedproducts-html.catalog-single.catalog-single h3{
background: #ffffff;
border: 0 solid #ffffff;
font-weight: 700;
text-align: center;
padding: 10px 10px 0
}

.hero-slider .ms-bullets.ms-dir-h{
bottom: 1px
}

.tech-specs .item:nth-child(odd){
background: #fafafa
}

#accordion .panel-border {
border: 1px solid #e6e6e6;
box-shadow: none;
border-radius: 3px;
margin-left: 10px;
margin-right: 10px
}

.fa-cut:before, .fa-scissors:before {
display:none
}

.CrisisBG {
margin-left: -15px!Important;
margin-right: -15px!Important
}

.CrisisUk img {
    width: 20px
}

.dashboard-sortable .grid.simple{
background: #e6e6e6;
min-height: 320px
}

.dashboard-sortable .big-image-bk {
color: #a2a4a5
}

.dashboard-sortable .grid.simple .grid-body .text-left  {
font-size: 12px
}

.dashboard-sortable .grid.simple .grid-body {
background: #fafafa;
padding-top: 10px;
font-size: 12px;
color: #454545
}

.dashboard-sortable .grid.simple .grid-body .text-left hr   {
border-top: 1px solid #d6d6d6
}

.myaccount.users .grid.simple.ui-resizable .grid-body, .myaccountdashboard_container .grid.simple.ui-resizable .grid-body  {
overflow-y: hidden !important
}

catalog-single .product-description P {
max-width: 90%
}

@media only screen and (max-width: 1023px) {
.Nodisplay1366{
display:none
} }

.cart-dropdown .cart-resume .promotion_discount .promotion_discount_result, .shopping-cart .cart-resume .promotion_discount .promotion_discount_result .alert-warning .alert-warning {
background-color: #474747;
color: #fff;
border-color: #474747;
font-weight: 400
}

.shopping-cart .cart-resume .promotion_discount .coupon_apply {
background: #3dbbbb;
border-radius: 5px;
font-weight: 700
}

.shopping-cart .cart-resume .promotion_discount .coupon_apply:hover {
background: #878787;
color:#f5f5f5
}

@media only screen and (max-width: 768px) {
.product-summary .product-brand img{
display:none
} }

@media only screen and (max-width: 768px){
.catalog-single .product-shopping-actions .product-shopping-actions-addtocart .btn-sm {
font-size: 1.2em
} }

@media only screen and (max-width: 768px) {
.ex-product .productaddtocart_container .product-stock {
display:none
} }

.cart-dropdown .softgraybackground{
border-top: 1px solid #d8d8d8
}

.cart-dropdown .footer .btn.btn-outlined-invert.btn-block.to-cart:hover {
background-color: #3dbbbb
}

.cart-dropdown table.minicart td:first-child {
height: 100px
}

.cart-dropdown .header .btn {
color: #222;
    background-color: #9ce6ff;
    border: 0;
    border-radius: 0;
    font-weight: 900;
    font-size: 1em;
    padding: 6px 15px
}

.cart-dropdown .header .btn:hover{
color: #fff;
background-color: #3dbbbb
}

.cart-dropdown .body {
padding: 15px 10px;
background: #f5f5f5
}

.cart-dropdown table {
background-color: #fff
}

#productsrelated_152617 .catalog-single.has-carousel {
border: 0
}

.toolbar .account-btn span:hover {
color: #3dbbbb
}

/* Remove Coupon from Basket */

.shopping-cart .softgraybackground {
background: #ffffff
}

.shopping-cart table tbody {
border-bottom: 0 solid;
background: #ffffff
}

.shopping-cart .btn-block {
background: #ffffff;
    color: #006d6d;
    border: 1px solid #b9dada !important;
    border-radius: 5px;
    font-size: 14px;
    font-weight: 500;
    min-height: 42px;
    padding: 10px 15px;
    box-shadow: none;
    box-sizing: border-box
}

.shopping-cart .btn-block:hover {
background: #878787;
color: #f5f5f5
}

.shopping-cart .softgraybackground td{
border: solid 0
}

.shopping-cart table th {
font-weight: 700
}

table.items-list {
padding: 10px
}

.btn-black{
background: #9ce6ff
}

.shopping-cart .cart-topbuttons .btn-media-full {
padding: 10px 20px;
background: #b2b2b2;
color: #fff
}

@media only screen and (min-width: 650px) {
.shopping-cart .to-checkout {
    padding: 6px 20px
} }

.shopping-cart .softgraybackground {
border: solid 2px #b1b2b3
}

.shopping-cart .clearCartBtn .btn-sm {
background: #efefef;
color: #000;
border: 2px solid
}

.shopping-cart .cart-topbuttons .btn-media-full:hover {
background: #878787;
color: #f5f5f5
}

.shopping-cart .clearCartBtn .btn-sm:hover {
background: #dc143c;
color: #fff
}

.shopping-cart .to-checkout {
font-weight: 700;
border: 0 solid #878787;
color: #222
}

.shopping-cart .cart-resume .cart-totals table tr td {
font-size: 18px
}

/* This is for the cart page merchandizing widget */
.myMerchCart {
    display: none
}

body.ex-product .selection-not-available, body.ex-product .selection-not-available-mobile .alert-warning {
background-color: #3dbbbb3d;
color: #333;
border-color: #008080;
border-radius: 5px;
text-transform: capitalize;
max-width: 80%;
font-size: 14px;
margin-left: auto;
margin-right: auto;
width: 80%
}

.ribboncart-wrapper .ribboncart  {
padding: 5px 10px;
margin-top: 3px;
text-align: center;
border-radius: 3px;
width: 100%
}

.ribboncart-wrapper .ribboncart-tips   {
display: none
}

@media only screen and (max-width: 768px) {
.tileparent {
border: 0
} }

@media only screen and (max-width: 768px) {
.catalog-grid .tile {
border: 1px solid #ddd;
padding: 10px
} }

/* Mini Cart Changes */

.toolbar .cart-btn>.btn span.minicart_count:hover:after {
  height: 9px
}

/* Mini Cart Changes End */

.catalog-single .tile .footer button.is-master span {
font-size: 1em;
font-weight: 700
}

.owl-carousel.owl-drag .owl-item .footer button.is-master {
min-width: 100%;
background: #3dbbbb
}

/* Button Groups Removed if Logged Out - End */

catalog-grid .tile .footer button.is-master span {
font-size: 1em;
font-weight: 700
}

#menulinks_153301.menulinks_container section.quicklinks .title,
#menulinks_152642.menulinks_container section.quicklinks .title,
#menulinks_152749.menulinks_container section.quicklinks .title,
#menulinks_152849.menulinks_container section.quicklinks .title {
background-color: #2c3949;
padding: 10px 5px;
bottom: 0;
border-radius: 0;
color: white;
text-align: center;
position: relative;
font-size: 1rem;
border: solid 0 #c6c6c6;
font-weight: 200
}
#menulinks_153301.menulinks_container section.quicklinks,
#menulinks_152749.menulinks_container section.quicklinks,
#menulinks_152849.menulinks_container section.quicklinks{
margin-top: 10px
}

#menulinks_153301.menulinks_container section.quicklinks,
#menulinks_152642.menulinks_container section.quicklinks,
#menulinks_152749.menulinks_container section.quicklinks,
#menulinks_152849.menulinks_container section.quicklinks  {
background: #fafafa
}

#menulinks_153301.menulinks_container section.quicklinks li,
#menulinks_152642.menulinks_container section.quicklinks li,
#menulinks_152749.menulinks_container section.quicklinks li,
#menulinks_152849.menulinks_container section.quicklinks li {
line-height: 1rem;
margin: 0 0 2px;
padding: 5px 0 5px .5rem;
border-left: 3px solid;
border-color: #fafafa
}

#menulinks_153301.menulinks_container section.quicklinks ul,
#menulinks_152642.menulinks_container section.quicklinks ul,
#menulinks_152749.menulinks_container section.quicklinks ul,
#menulinks_152849.menulinks_container section.quicklinks ul  {
margin-bottom: .3em;
color: #1b507a;
font-weight: 200;
margin-left: 10px;
margin-right: 10px
}

#menulinks_153301.menulinks_container section.quicklinks li a:hover,
#menulinks_152642.menulinks_container section.quicklinks li a:hover,
#menulinks_152749.menulinks_container section.quicklinks li a:hover,
#menulinks_152849.menulinks_container section.quicklinks li a:hover {
font-weight: 200!Important;
color: #2c3949
}

#menulinks_153301.menulinks_container section.quicklinks li:hover,
#menulinks_152642.menulinks_container section.quicklinks li:hover,
#menulinks_152749.menulinks_container section.quicklinks li:hover,
#menulinks_152849.menulinks_container section.quicklinks li:hover  {
background: #f3f3f3;
border-left: 3px solid #3dbbbb;
font-weight: 200!Important;

}

body.ex-product .productaddtocart_container .product-shopping-actions .price-from {
margin: .5em 0;
font-size: 1.4em;
color: #2c3949
}

body.ex-product .product-options .option-group-radiobox input[checked=true] + label{
font-weight: 700!Important
}

body.ex-product .product-options .option-group .option-group-swatch input[checked=true]+label {
font-weight: 700
}

@media only screen and (max-width: 768px){
body.ex-product .product-options .option-group .option-group-swatch label{
padding: 5px
} }

@media only screen and (max-width: 768px){
.catalog-single .product-description {
padding: 0 1em
} }

body.ex-product .product-options .option-group .option-group-swatch .swatch  {
height: 30px;
width: 75px;
margin-bottom: 5px;
margin-right: 0;
border-radius: 6px
}

body.ex-product .product-options .option-group .option-group-swatch input[checked=true] + label .swatch {
    border: 2px solid #000000!important;
    border-radius: 6px;
    box-sizing: border-box
}

body.ex-product .product-options .option-group .option-group-swatch .swatch:hover {
outline-offset: 1px;
outline: 2px solid #454545
}

.hearbghome {
background: #ffffff none repeat scroll 0 0;
border: 1px solid #e4e4e4;
box-shadow: 1px 1px 2px #949494
}

@media only screen and (max-width: 768px){
.listtools .sortby {
display: inline!important;
float: left;
width: 25%;
font-size: 12px
} }

.mobfreq .owl-carousel .owl-stage-outer {
transform: translate3d(-15px, 0, 0)
}

@media only screen and (max-width: 1000px) {
.Nodisplay{
display:none
} }

@media only screen and (max-width: 420px) {
.widget-lastviewedproducts-html.catalog-single {
display:none
} }

@media only screen and (max-width: 768px){
.indicators-grid{
min-height: 5px;
max-height: 5px;
display: none
} }

@media only screen and (max-width: 768px) {
.catalog-single h3 {
font-size: 1.4em
} }

@media only screen and (max-width: 768px) {
#accordion .panel-border {
text-align: left;
margin-left: 0;
margin-right: 0
} }

@media (max-width: 768px){
.mobileimgbg {
background: #d8d8d8;
padding: 5px
} }

@media only screen and (max-width: 768px){
.pagination li {
padding: 1px 4px;
    border: 0 solid #efefef
} }

.swiper-container-slider3 .romw .romw-author-photo img {
width: 25px!Important;
height: 25px!Important
}

.widget-lastviewedproducts-html .product-stock .out-stock{
font-size: .8em!important
}

.swiper-container-slider3 .romw-container {
height: 120px!Important
}

.swiper-button-next, .swiper-button-prev {
top: 40%!Important
}

.rocketScroll .scrollContent {
font-size: 12px
}

.swiper-container-slider3 .swiper-slide {
padding: 10px
}

.productquickview .buttons.group {
display: none!Important
}

.productquickview .catalog-single .softgraybackground, .softgraybackground {
border: none
}

.divquickview button.showquickview  {
display: none;

background-color: #3dbbbb!Important;
color: #000!Important;
font-size: 14px;
font-weight: 700;
border: 2px solid #2c3949
}

.productquickview .old-price {
display:none
}

.productquickview .btn-sm {
font-size: 1.6em
}

.catalog-single .buttons .qnt-count .incr-btn-quick  {
width: 35px;
height: 30px;
margin-top: 5px;
border-radius: 5px
}

.catalog-single .buttons .qnt-count .incr-btn-quick:hover  {
background: #3dbbbb
}

.productquickview .fa-shopping-bag:before {
content: none!Important
}

#productsrelated_144568 {
padding-top: 10px
}

#productsrelated_144568 .catalog-single.has-carousel  {
border: 0
}

#productsrelated_144568 .catalog-single.has-carousel .tile{
min-width: 240px;
max-width: 240px;
margin: 10px 5px!Important;
transform: translate3d(-15px, 0, 0)
}

#productsrelated_144568 .catalog-single .tile img {
max-width: 105px
}

#productsrelated_144568 .relationship-carousel .owl-nav {
height: 2em
}

#productsrelated_144568 .productsrelated h3 {
background: #2c3949;
color: white;
margin-top: 0;
margin-left: 0;
margin-right: 0;
font-size: 1.2em
}

#productsrelated_144568 .sidebar-content {
background: #f9fafb
}

#productsrelated_144568 .owl-carousel .owl-stage-outer{
background: #ffffff
}

#productsrelated_144568 .productsrelated h3 {
margin-bottom: 0; text-align: center!important;padding: 8px 0}

.catalog-single.has-carousel .tile {
margin: 10px 4px
}

#productsrelated_144568 .catalog-single .tile .product-name {
line-height: 1.3
}

#productsrelated_144568 .buttons.group {
display: block!Important
}

#productsrelated_144568 .has-carousel .tile .footer .product-name{
min-height: 40px!important;
max-height: 40px!important;
overflow: hidden
}

.catalog-single.has-carousel .tile,.catalog-single.has-grid .tile{border:1px solid #efefef; background-color: white; min-width: 250px;max-width: 250px}

.owl-carousel.owl-loaded {
margin-right:15px;
background: #ffffff
}

@media only screen and (min-width: 1500px) {
.cosheadertools a{
font-size: .8rem;
padding: 0 6 0 0;
margin-left: 5px
} }

@media screen and (min-width: 769px) {
.inktonerfinderwidget[data-layout=Horizontal] .form-group {
max-width: 22%
} }

.catalog-grid .buttons.group .inputquantity {
width: 50px
}

@media only screen and (max-width: 480px){
.cat-tiles a {
font-size: 1.6em
} }

@media only screen and (max-width: 768px){
.buttons.group {
text-align: center
} }

.searchpills p {
    font-size: 16px;
    font-weight: 400;
    text-align: center;
    margin: 10px 0 20px
}

.shop-filters section.search .select2-container {
    border: 0
}

.shop-filters section.search .search-form button[type="submit"] i {
    color: #2c3949
}

header section.search .search-form button[type="submit"] {
    top: 0;
    width: 48px;
    height: 48px;
    transition: .35s background
}

header section.search {
padding: 0
}

header section.search .search-form .form-group input  {
border-width: 0
}

/* This is needed for Google Feeds to work */
.price-label.has-price::after,
.price > .has-price::after,
.price.has-price::after {
   content: ' ex VAT';
   font-size: 14px
}
.product.non-taxable .price-label.has-price::after,
.product.non-taxable .price > .has-price::after,
.product.non-taxable .price.has-price::after {
   content: ' incl VAT';
   font-size: 14px
}

.price-label.has-price::after, .price > .has-price::after, .price.has-price::after{
color: #000;
margin-left: 4px
}

.catalog-grid .list-attribute.product-category {
display: none
}

.catalog-grid .tile .price-label {
font-size: 1.8em;
color: #454545
}

.catalog-grid .tile .price-label.has-price::after, .price > .has-price::after, .price.has-price::after {
font-size: 12px;
margin-left: 5px;
color: #454545
}

.widget-lastviewedproducts-html .product-stock { display: none
}

.toolbar .account-dropdown .arrow_box {
left: 60px
}

.header-full a.logo img{max-height:inherit!important}

.product-compare-action .fa-square-o:before {
    content: "\f096";
    padding: 0;
    color: #9e9e9e;
    background: white
}

.catalog-grid h2 {
color: #2c3949
}

.inktonerfinderwidget[data-layout=Horizontal] .horizontal_layout_left .horizontal_title {
font-size: 1.3em;
font-weight: 700
}

#lastviewedproducts_164822 .ribbon-wrapper {
display: none
}

#imageslider_110223 .imageslider_wrapper   {
margin-top: 0;
margin-bottom: 0
}

.product-shopping-actions .product-shopping-actions-row .list-attribute.product-stock + .list-attribute.product-stock{
  display:none
}

/*Mini Cart Effect */
.cart-dropdown {
outline: solid #0e0e0e99 2000px;
transition:all .5s ease-in
}

/*OWL Buttons */
.owl-carousel .tile .footer .btn {
border-radius: 10px;
border: 0;
box-shadow: rgba(9, 30, 66, 0.25) 0 1px 1px, rgba(9, 30, 66, 0.13) 0 0 1px 1px
}

.owl-carousel .tile .footer .btn:hover {
border: 0
}

/*OWL Buttons - end */

/*Floating button - Quote Me */

#htmlcontent_185915 #quote-product-list-button {
background: #ade3fe;
border-radius: 5px;
margin-top: 0;
height: 48px;
box-shadow: none;
min-width: 80px;
border: 1px solid #e6e6e6
}

#htmlcontent_185915 #quote-product-list-button:hover {
background: #c9c9c9
}

#htmlcontent_185915 #quote-product-list-button .fa-quote-left {
font-size: 0;
padding-bottom: 10px
}

#htmlcontent_185915 #quote-product-list-button .fa-quote-left:before:hover{
color: #222!Important
}

#htmlcontent_185915 #quote-product-list-button .fa-quote-left:after  {
content: "Active Quote";
    color: #111;
    font-size: 14px;
    font-weight: 700;
    position: absolute;
    bottom: 0;
    left: 0;
    text-transform: uppercase;
    font-family: 'Source Sans Pro',sans-serif;
    padding: 8px 10px;

}

#quote-product-list-button {
transition: all .5s ease;
background: #3dbbbb
}

/*Floating button - Quote Me -end */

/* Quote 2 */

.ex-searchresult .quoteme-wrapper,
.ex-category .quoteme-wrapper {
display: block !important
}

.catalog-grid .tile .footer .quoteme-wrapper span {
margin-left: 5px
}

.catalog-grid .tile .footer .quoteme-wrapper span:hover {
color: white
}

.catalog-grid .tile .footer .quoteme-wrapper {
padding-left: 0
}

.catalog-grid .tile .footer .quoteme-wrapper a {
background: #3dbbbb;
font-size: 12px;
border: 0;
box-shadow: rgba(9, 30, 66, 0.25) 0 1px 1px, rgba(9, 30, 66, 0.13) 0 0 1px 1px;
padding: 5px;
transition: .35s all;
width: auto;
display: flex;
justify-content: center;
border-radius: 3px;
margin-top: 3px;
text-transform: uppercase;
min-height: 20px;
color: #fff
}

.catalog-grid .tile .footer .quoteme-wrapper a:hover {
background: #878787;
color: #fff
}

.catalog-grid .tile .footer .quoteme-wrapper i.fa.fa-thumbs-o-up {
display: none
}

#filterswrapperhorizontal .dropdown-menu {
font-size: .9em
}

.gridcontentnew .label.label-danger {
background-color: #f00;
color: #fff
}

#quotebuildernew .form-inline:not(.quote-toggle) label, #salesquote .form-inline:not(.quote-toggle) label  {
font-size: .9em;
justify-content: flex-start
}

.gridcontentnew .label {
border-radius: 5px;
border: 0
}

#quotebuildernew .form-inline:not(.quote-toggle) input, #quotebuildernew .form-inline:not(.quote-toggle) select, #quotebuildernew .form-inline:not(.quote-toggle) textarea, #salesquote .form-inline:not(.quote-toggle) input, #salesquote .form-inline:not(.quote-toggle) select, #salesquote .form-inline:not(.quote-toggle) textarea {
text-transform: uppercase
}

.fa-line-chart:before {
content: "\f10d"
}

#quotebuildernew .content_value, #salesquote .content_value {
padding: 5px 15px
}

#quotebuildernew .addcartqueue, #salesquote .addcartqueue  {
border-radius: 5px;
border: 0
}

#quotebuildernew .addcartqueue:hover, #salesquote .addcartqueue:hover  {
background: #3dbbbb
}

#quotebuilder .heading-title, #quotebuildernew .heading-title, #salesquote .heading-title {
text-transform: uppercase
}

#quotebuildernew .total-margin .content_value, #salesquote .total-margin .content_value {
background: #e5f3fe
}

#quotebuilder, #quotebuildernew, #salesquote {
background-color: #fff
}

#quotebuilder .panel, #quotebuildernew .panel, #salesquote .panel {
border: solid #b1b2b3
}

#quotebuilder .panel-heading, #quotebuildernew .panel-heading, #salesquote .panel-heading {
background: #efefef
}

#mc_embed_signup #quotebuildernew .actions-wrapper .button, #mc_embed_signup #salesquote .actions-wrapper .button, #quotebuildernew .actions-wrapper #mc_embed_signup .button, #quotebuildernew .actions-wrapper .btn, #quotebuildernew .actions-wrapper .ctct-form-button, #salesquote .actions-wrapper #mc_embed_signup .button, #salesquote .actions-wrapper .btn, #salesquote .actions-wrapper .ctct-form-button {
border-radius: 5px;
border: 0
}

#mc_embed_signup #quotebuildernew .actions-wrapper .button:hover, #mc_embed_signup #salesquote .actions-wrapper .button:hover, #quotebuildernew .actions-wrapper #mc_embed_signup .button:hover, #quotebuildernew .actions-wrapper .btn:hover, #quotebuildernew .actions-wrapper .ctct-form-button:hover, #salesquote .actions-wrapper #mc_embed_signup .button:hover, #salesquote .actions-wrapper .btn:hover, #salesquote .actions-wrapper .ctct-form-button:hover {
background: #3dbbbb
}

#mc_embed_signup .myquotebuilderitems .button-content .button, #mc_embed_signup .myrecurringorders .button-content .button, .myquotebuilderitems .button-content #mc_embed_signup .button, .myquotebuilderitems .button-content .btn, .myquotebuilderitems .button-content .ctct-form-button, .myrecurringorders .button-content #mc_embed_signup .button, .myrecurringorders .button-content .btn, .myrecurringorders .button-content .ctct-form-button {
border-radius: 5px;
border: 0
}

#mc_embed_signup .myquotebuilderitems .button-content .button:hover, #mc_embed_signup .myrecurringorders .button-content .button:hover, .myquotebuilderitems .button-content #mc_embed_signup .button:hover, .myquotebuilderitems .button-content .btn:hover, .myquotebuilderitems .button-content .ctct-form-button:hover, .myrecurringorders .button-content #mc_embed_signup .button:hover, .myrecurringorders .button-content .btn:hover:hover, .myrecurringorders .button-content .ctct-form-button:hover {
background: #3dbbbb
}

#mc_embed_signup #quotebuildernew .actions-wrapper .button i:before, #mc_embed_signup #salesquote .actions-wrapper .button i:before, #quotebuildernew .actions-wrapper #mc_embed_signup .button i:before, #quotebuildernew .actions-wrapper .btn i:before, #quotebuildernew .actions-wrapper .ctct-form-button i:before, #salesquote .actions-wrapper #mc_embed_signup .button i:before, #salesquote .actions-wrapper .btn i:before, #salesquote .actions-wrapper .ctct-form-button i:before  {
color: #fff
}
/* Quote 2 end */

.merchandising-carousel .inner  {
max-width: 98%
}

.tileparent {
border-top: 0
}

.listtoolsbottom {
border-top: 0
}

.catalog-grid #grid .brand-label img {
max-height: 70px;
max-width: 125px
}

catalog-grid #grid .brand-label {
line-height: 50px
}

/* Swatch Edits*/

body.ex-product .product-options .option-group .option-group-swatch {
min-width: 80px;
display: flex;
justify-content: center
}

body.ex-product .product-options .option-group-values {
display: flex;
flex-direction: row;
flex-wrap: wrap;
align-items: baseline
}

body.ex-product .product-options .option-group .option-group-swatch label {
    font-size: 10px;
    width: 75px!Important;
    text-overflow: ellipsis;
    line-height: 1.1em;
    text-align: center;
    overflow-wrap: break-word
    }

div#htmlcontent_187580 {
    padding: 0
}

.categories-wrapper h3 {
 font-size: 1.2em
}

.products-wrapper+.categories-wrapper {
background: #a7e1fd;
font-size: 1.2em
}

.col-md-12.product-shopping-actions-prices .label.label-danger.save.with-value {
position: absolute;
    top: 0;
    right: 15px;
    z-index: 1;
    font-size: 14px;
    border-radius: 0 10px 0 30px;
    font-weight: 700;
    text-transform: none;
    color: #fff;
    height: 50px;
    padding: 10px 0 0 5px;
    width: 50px;
background: #3dbbbb
}

@media only screen and (max-width: 1024px){
.col-md-12.product-shopping-actions-prices .label.label-danger.save.with-value {
display:none
}
}

.catalog-single .product-shopping-actions .product-compare-action i.fa-square-o:before, .catalog-single .product-shopping-actions .product-shopping-actions-addtoquicklist i:before {
content: ""
}

.col-md-12.product-shopping-actions-addtoquicklist .fa-plus:before {
    content: "\f004"!Important;
    color: #3dbbbb;
    margin-right: 3px;
font: normal normal normal 14px/1 FontAwesome
}

.col-md-12.product-shopping-actions-addtoquicklist .fa-plus:hover:before {
color: #0082ad
}

.catalog-single .product-shopping-actions .product-shopping-actions-addtoquicklist i {
margin-right: 10px
}

.product-shopping-actions-addtoquicklist a {
color: #454545
}

.catalog-single .product-shopping-actions .addtocartWrap {
padding: 0 15px
}

.catalog-single .product-shopping-actions .prodToolsWrap > .row {
    margin: 0
}

.ex-loggedout .prodToolsWrap {
display: none
}

.catalog-single .product-shopping-actions .product-compare-action, .catalog-single .product-shopping-actions .product-shopping-actions-addtoquicklist {
margin: 0;
padding: 0;
border: none;
font-size: 12px;
line-height: 16px;
width: auto
}

.cookiespolicies-banner {
background: transparent ! Important;
    position: fixed;
    width: 100%;
    bottom: 0;
    left: 0;
    z-index: 8000;
border-top: 0!Important
}

h2.cookiespolicies-header {
font-size: 16px
}

.cookiespolicies-preferences-table>div div:nth-of-type(2)  {
margin-top: 10px
}

button.btn.btn-sm.cookiespolicies-manager-btn {
background: #cdcdcd
}
.cookiespolicies-text-title {
font-size: 14px
}

.cookiespolicies-banner .container-fluid {
    pointer-events: auto;
    position: relative;
    width: 100%;
    max-width: 720px;
    padding: 28px;
    border-radius: 18px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.12), 0 2px 10px rgba(0, 0, 0, 0.06);
    display: flex;
    gap: 24px;
    align-items: center;
    animation: cookieSlideUp .4s ease
}

.cookiespolicies-banner .cookiespolicies-text p {
    margin-bottom: 0;
    padding-right: 10px
}

.cookiespolicies-banner .cookiespolicies-buttons {
position: relative;
display: block ! Important;
    width: 30%;
    float: left;
    padding-left: 2%;
    bottom: 0;
    right: 0
}

.cookiespolicies-banner .cookiespolicies-text {
position: relative;
    display: inline-block;
    width: 70%;
    float: left;
    padding: 0
}

.cookiespolicies-header, .cookiespolicies-text p {
    color: #454545
}

.cookiespolicies-gotit, .cookiespolicies-manager-btn, .cookiespolicies-manager-allow {
    position: relative;
    display: inline-block;
    width: 100%;
    float: left;
    padding: 10px;
    color: #fff;
    cursor: pointer;
    text-align: center;
    border-radius: 5px
}

cookiespolicies-text p {
    margin: 0;
    font-size: .95rem;
    line-height: 1.6;
    color: #4b5563
}

.cookiespolicies-gotit,
.cookiespolicies-manager-btn,
.cookiespolicies-manager-allow {
    width: 100%;
    padding: 12px 18px;
    border: none;
    border-radius: 12px;
    font-size: .95rem;
    font-weight: 600;
    cursor: pointer;
    transition: all .25s ease
}

.product img,
.productquickview img { pointer-events:none
}

#vuequicklistdropdown .dropdown-menu li {
display: block
}

.myaccount .fa-list, .myaccount .fa-list-alt {
font: normal normal normal 24px/1 FontAwesome;
color: #878787
}

.myaccount .myaccount-title span {
font-size: 1em
}

.orderpads-v2 .listtools.listtools-top .bulk-actions-button.float {
top: 300px;
box-shadow: none
}

#quicklistgrid .btn {
background: #f5f5f5;
border: 1px solid #878787;
margin-left: 2px;
height: 30px
}

.gridcontentnew #quicklistgrid .content_value:not(.content_name_value) {
color: #000
}

#quicklistgrid span.content_value.content_name_value {
font-size: 14px
}

.gridcontentnew table input, .gridcontentnew table select {
color: #000
}

#quicklistgrid .btn:hover {
background: #3dbbbb;
color: #000
}

#quicklistgrid .table-action .btn i {
font-size: 1.2em;
margin-right: 0;
vertical-align: initial
}

.quicklistsedit .product-select-action.single-product-select-action .fa-stack, .callofforders .product-select-action.single-product-select-action .fa-stack, .contractitems .product-select-action.single-product-select-action .fa-stack {
line-height: 1.5em;
font-size: 14px;
right: 20px;
top: 5px
}

.quicklistsedit .col-sm-4.imagecontent {
width:25%;
mix-blend-mode: multiply
}

.contractitems .imgthumbnail {
mix-blend-mode: multiply
}

.contractitems .product-stock .in-stock {
font-size: 12px;
font-weight: 700;
color: #068800;
padding: 5px 15px;
text-align: center;
background: #eefbee;
border: none;
display: inline-block
}

.contractitems .product-stock .out-stock {
font-size: 12px;
font-weight: 700;
color: #000;
text-align: center;
background: #ffe2e2 ! Important;
border: none
}

.quicklistsedit .col-sm-7.productcontent.product-content {
width:66.6666%;
border-right: 2px #e6e6e6 solid
}

.quicklistsedit .margin-list {
margin: 0;
padding: 10px
}

.callofforders .product-sku, .contractitems .product-sku, .quicklistsedit .product-sku{
width: 100%
}

.quicklistsedit .product-indicators, .contractitems .product-indicators {
display: none
}

.callofforders .label-focus, .contractitems .label-focus, .quicklistsedit .label-focus{
width: 40%;
font-size: 100%;
background: #878787
}

.callofforders .product-stock .in-stock, .contractitems .product-stock .in-stock, .quicklistsedit .product-stock .in-stock {
max-width: 40%;
font-size: 12px;
font-weight: 700;
color: #068800;
padding: 5px 15px;
text-align: center;
background: #eefbee;
border: none;
display: inline-block
}

.callofforders .price-from, .contractitems .price-from, .quicklistsedit .price-from {
font-size: 1.1em!Important
}

.callofforders .product-row, .contractitems .product-row, .quicklistsedit .product-row {
 margin-bottom: 0
}

.callofforders input.qty-list.form-control, .callofforders input.qty-list.select2-selection--single, .contractitems input.qty-list.form-control, .contractitems input.qty-list.select2-selection--single, .quicklistsedit input.qty-list.form-control, .quicklistsedit input.qty-list.select2-selection--single {
width: 70px;
font-size: 1.2em
}

.callofforders .product-compare-action, .contractitems .product-compare-action, .quicklistsedit .product-compare-action{
background: transparent;
margin-right: 10px;
height: 30px;
border-top: 0 solid #e6e6e6
}

.callofforders .gridtools .blockbutton i.fa-shopping-bag, .contractitems .gridtools .blockbutton i.fa-shopping-bag, .quicklistsedit .gridtools .blockbutton i.fa-shopping-bag {
display: none
}

.callofforders .gridtools button, .contractitems .gridtools button, .quicklistsedit .gridtools button {
font-weight: 700
}

.callofforders .shopping-actions .price span.has-price, .contractitems .shopping-actions .price span.has-price, .quicklistsedit .shopping-actions .price span.has-price{
color: #121212!important;
font-size: 1.4em
}

.fa-shopping-bag:before {
content: "\f290"
}

.quicklistsedit .fa-square-o:before, .callofforders .fa-square-o:before, .contractitems .fa-square-o:before  {
font: normal normal normal 22px/1 FontAwesome
}

.cart-dropdown .fa-shopping-bag:before {
display:none
}
.orderpads-v2 #productlist .btn-add-to-cart:not(.click-collect-atc-btn) {
text-transform: uppercase;
font-weight: 700
}

.quicklistsedit button.delete.btn.btn-sm.btn-sm-icon, .callofforders button.delete.btn.btn-sm.btn-sm-icon, .contractitems button.delete.btn.btn-sm.btn-sm-icon {
background: #3dbbbb
}

.quicklistsedit button.delete.btn.btn-sm.btn-sm-icon:hover, .callofforders button.delete.btn.btn-sm.btn-sm-icon:hover, .contractitems button.delete.btn.btn-sm.btn-sm-icon:hover {
background: #fe002d
}

.callofforders .gridtools button, .quicklistsedit .gridtools button {
font-weight: 700;
background: white;
border: 1px solid #c6c6c6;
color: #000
}

.callofforders .gridtools button:hover, .quicklistsedit .gridtools button:hover {
background: #3dbbbb
}

.contractitems .btn:hover {
background: #3dbbbb;
color: #000
}

.orderpads-v2 .btn.btn-xs.btn-update-default-qty:before {
content: "\f021";
font: normal normal normal 12px/1 FontAwesome;
margin-right: 10px
}

#productlist .product-name {
margin: 20px 0
}

.orderpads-v2 .btn.btn-xs.btn-update-default-qty {
margin-top: 0;
background: #f5f5f5;
border: 1px solid #c6c6c6;
color: #454545;
margin-bottom: 5px;
width: 40%;
height: 30px;
font-weight: 700
}

.orderpads-v2 .btn.btn-xs.btn-update-default-qty:hover {
background: #3dbbbb
}

.orderpads-v2 #productlist .btn-add-to-cart:not(.click-collect-atc-btn):hover {
color: #000
}

.catalog-grid .margin-list {
margin: 0;
padding: 0
}

.catalog-grid .margin-list .softgraybackground .buttons.group {
display: block
}

.quicklistsedit .shop-filters .filter-title, .contractitems .shop-filters .filter-title{
border-right: 0;
border-left: 0
}

.contractitems .brand-label, .quicklistsedit .brand-label, .callofforders .brand-label {
display: none
}

.contractitems .product-row, .quicklistsedit .product-row {
border: 1px solid #ddd;
margin-bottom: 5px!Important
}

.contractitems .brand-label {
display: none
}

.contractitems .shop-filters, .quicklistsedit .shop-filters, .contractitems .brand-label {
background: #fafafa
}

.contractitems .softgraybackground, .quicklistsedit .softgraybackground {
padding: 0
}

.contractitems .tileparent, .quicklistsedit .tileparent {
padding: 10px;
background: white
}

.orderpads-v2 .listtools.listtools-top {
padding: 10px
}

.quicklistsedit .buttons.group .inputquantity {
border-radius: 5px
}

.quicklist-groups-btn-wrapper {
left: 15px
}

.quicklistsedit .softgraybackground {
background: transparent!Important;
padding: 5px;
border: 0
}

.contractitems .softgraybackground, quicklistsedit .softgraybackground, .callofforders .softgraybackground{
background: transparent ! Important;
padding: 5px;
border-style: solid;
border-color: #0000001a;
border-width: 0;
border-radius: 10px
}

@media (min-width: 769px){
.catalog-grid .container {
padding: 0
} }

/* Badges on mini cart*/
.ribboncart-wrapper .ribboncart {
font-size: .85em;
display:none
}

.pbImg {
position: absolute;
width: 100%;
height: 100%;
background: url(https://eu.evocdn.io/dealer/1022/content/media/SitStandDesks_1.png)no-repeat center;
background-size: cover;
transition: .35s all
}

.pbHov {
text-transform: uppercase;
top: 20px;
left: 20px;
    transform: scale(0);
    color: #fff;
    font-size: 14px;
    transition: .35s all;
    position: absolute;
    opacity: 1;
    padding: 12px;
    background: #272727;
    font-weight: 700
}

/*scroll boxes (counter)*/
.scrollCount{
background:#fdfdfd;
padding:20px 30px;
flex-wrap:wrap;
align-items: stretch;
border-radius: 15px;
margin-top: 20px;
border: 1px solid #e6e6e6
}
.scrollBox{
width:20%;
position:relative;
background:#fdfdfd;
display:flex;
align-items:center;
justify-content:center;
flex-direction:column;
padding:5px
}
.scrollBox:not(:last-of-type):after{
content:"";
position:absolute;
right:0;
height:100px;
width:2px;
background-color: #e4e4e4
}
.ieOnly .scrollBox:not(:last-of-type):after{
top:-15px
}
.scrollBox h3 {
font-size: clamp(20px, 1.5vw, 60px);
color:#454545;
text-align:center;
margin:0 0 20px;
font-weight:400;
font-family: 'Archivo Narrow', sans-serif
}
.scrollBox p{
margin:0;
font-weight:700;
font-family:"Roboto", sans-serif;
text-align:center;
width:100%;
font-size: .85em
}
@media only screen and (max-width:768px){
.scrollCount{
padding:20px
}
.scrollBox{
width:100%
}
.scrollBox:nth-of-type(odd):after{
display:none
}
.scrollBox:nth-of-type(even):after{
display:none
}
.scrollBox:before{
content: "";
background-color: rgba(181,181,181,0.3);
position: absolute;
bottom: 0;
width: 100%;
height: 2px
}
}

div#contactform_195918 {
background: #f3f3f3;
padding: 30px;
margin-left: 2%;
width: 96%;
margin-right: 2%
}

.nav>li>a:focus, .nav>li>a:hover {
background-color: transparent;
color: #3dbbbb
}

@media (min-width: 992px){
.modal-lg {
width: 800px
} }

#workwearmodal label {
font-weight: 700
}

#bulkbuymodal label {
font-weight: 700
}

.contact-form .form-group1 {
margin-bottom: 12px
}

.quicklistsedit .brand-label img {
display: none
}

.quicklistsedit .group-filters {
background: #ffffff;
border-radius: 0;
border: 1px solid #e3e3e3;
margin-top: 10px
}

.fa-stack-2x {
font-size: 20px
}

.fa-ban:before {
color: #454545!Important;
padding: 5px;
font: normal normal normal 20px/1 FontAwesome
}

.gbp.fa-money-non-taxable:before {
color: transparent;
background-repeat: no-repeat;
background-image: url(https://eu.evocdn.io/dealer/1022/content/media/COSNoVAT4.svg);
font: normal normal normal 20px/1 FontAwesome
}

.myaccount .switch label:before {
background-color: var(--evo-border-color, #ffffff) !important
}

.myaccount .switch label:after {
background-color: #333333 ! Important
}

.myaccount .switch .cmn-toggle:checked+label:before {
background-color: #fff !important
}

.myaccount .switch .cmn-toggle:checked+label:after {
background-color: #3dbbbb !important
}

.quicklistsedit .gridtools {
padding-top: 10px;
padding-bottom: 10px
}

.quicklistsedit .product-select-action .fa-stack {
right: 0
}

.quicklistsedit .listtools {
border: 0
}

.group-filters .quicklist-group-title  {
padding-top: 0
}

.quicklistsedit .listtools {
padding: 10px;
margin: 0
}

.gridtools .items-selected .btn-group button {
border: 1px solid #c6c6c6
}

#htmlcontent_192620 .floating-more-button {
display: none
}

.grid-title .cdash-icon i {
padding: 10px 8px
}

.dashboard-sortable .grid-body div .fa-truck:before {
font-size: inherit
}

#htmlcontent_192620 .floating-more-button .btn-sm {
height: 48px;
font-size: 16px;
background: #e6e6e6;
font-weight: 900;
padding: 6px 15px;
border: 1px solid #e6e6e6
}

#htmlcontent_192620 .filter-more-group .btn-filter-more .btn-icon i {
margin-right: 0
}

#htmlcontent_192620 .floating-more-button .btn-sm:hover {
background: #c9c9c9;
color: #454545
}

#htmlcontent_192620 .filter-more-group .btn-filter-more .btn-icon i:before {
content: "\f1de";
font: normal normal normal 16px/1 FontAwesome;
margin-left: 10px
}

.ex-loggedout #filterswrapperhorizontal .row-filter-toggles .filtername-instock  {
margin-left: 0
}

/* Begin change the search placeholder text */

.searchlist_hd::placeholder {
opacity: 0
}
.searchlist_hd.placeholdertext::placeholder {
opacity: 1
}

/* end */

.footLinksa li {
display: inline-block;
font-size: 12px;
text-transform: capitalize
}

.footLinksa li a:hover {
color: #3dbbbb
}

.headersection-8 {
background: #000000;
display: none
}

.text-cwhite1 {
white-space: nowrap;
border: 2px solid #454545;
font-weight: 600;
letter-spacing: 2px;
text-align: center;
text-transform: uppercase;
color: transparent;
-webkit-background-clip: text;
background-clip: text;
background-size: 400%;
animation: move 5s ease infinite;
background-image: linear-gradient(68.7deg, #1dadeb 13.2%, #8995fa 29.8%, #e56dd4 48.9%, #ff4480 68.2%, #ff5e00 86.4%)
}

.headersection-8 .btn-outlined-invert {
color: #fff
}

.headersection-8 .btn-outlined-invert:hover {
color: #3dbbbb
}

.filters-container {
padding-bottom: 50px
}

.catalog-grid .catalog-name {
padding: 15px 0;
display: flex;
justify-content: center;
font-size: 2.2em;
background: #e6f7f7;
color: #077;
border-radius: 10px;
margin: 0 5px 15px;
border: 1px solid #c0ecdf
}

@media (max-width: 768px) {
.catalog-grid .catalog-name  {
font-size: 1.5em;
padding: 10px 0
} }

#filterswrapperhorizontal .filter-more-group .btn-filter-more .btn-icon i:before, .skeleton-filters-horizontal .filter-more-group .btn-filter-more .btn-icon i:before {
content: "\f1de";
font: normal normal normal 16px/1 FontAwesome
}

.skeleton-filters-horizontal .ph-col-12 {
padding: 10px 0
}

.skeleton-filters-horizontal .ph-row-buttons {
display: flex;
height: 50px
}

#filterswrapperhorizontal .btn-group .btn-filter, .skeleton-filters-horizontal .btn-group .btn-filter {
min-height: 40px;
transition: background .35s;
position: relative;
z-index: 6;
min-width: 175px;
width: 100%
}

#filterswrapperhorizontal .filter-more-group .btn-filter-more, .skeleton-filters-horizontal .filter-more-group .btn-filter-more {
min-height: 40px;
transition: background .35s;
position: relative;
z-index: 6;
border-radius: 10px
}

#filterswrapperhorizontal .btn-group .btn-filter, #filterswrapperhorizontal .btn-group .remove-filter, .skeleton-filters-horizontal .btn-group .btn-filter, .skeleton-filters-horizontal .btn-group .remove-filter {
border-radius: 10px
}

#filterswrapperhorizontal .btn-group .small, small {
color: #454545!Important
}

#filterswrapperhorizontal .filter-selected-group .remove-filter:hover {
color: red
}

#filtersModal .modal-dialog .shop-filters .filter-section-header h3 {
font-size: 1.1em
}

#filtersModal .modal-dialog .shop-filters .filter-section-header {
margin-bottom: 10px;
 margin-top: 10px
}

#filterswrapperhorizontal .filter-more-group .btn-filter-more:hover {
box-shadow: rgba(50, 50, 93, 0.25) 0 2px 5px -1px, rgba(0, 0, 0, 0.3) 0 1px 3px -1px
}

#filterswrapperhorizontal .btn-group .btn-filter:hover {
box-shadow: rgba(50, 50, 93, 0.25) 0 2px 5px -1px, rgba(0, 0, 0, 0.3) 0 1px 3px -1px
}

input.cmn-toggle-round-flat+label {
background-color: #fff
}

.shop-filters .filter-section.filtername-incontract input:checked+label::before, .shop-filters .filter-section.filtername-instock input:checked+label::before {
background-color: #fff
}

#filtersModal .filters-modal, #filtersModal .filterswrapper {
padding-bottom: 25px
}

#filterswrapperhorizontal .row-filter-toggles .filtername-incontract .filter-static, #filterswrapperhorizontal .row-filter-toggles .filtername-instock .filter-static {
margin-top: 7px
}

#filterswrapperhorizontal .row-filter-toggles .vertical-line {
border-left: 2px solid #3dbbbb
}

#filtersModal .modal-dialog .shop-filters {
padding: 0
}

#filterswrapperhorizontal .fa-square-o {
display: block;
width: 20px;
height: 20px;
border: 1px solid #ccc;
border-radius: 3px;
position: relative;
order: 2;
margin: 0 0 0 auto
}

#filterswrapperhorizontal .filter-more-group .btn-filter-more {
width: 100%
}
#filterswrapperhorizontal .col-xs-12 {
display: flex;
gap: 5px
}

#filterswrapperhorizontal .btn-group .btn-filter:hover {
background: #3dbbbb;
color: white
}

#filterswrapperhorizontal .filter-more-group .btn-filter-more:hover {
background: #454545
}

#filterswrapperhorizontal .btn-sm {
font-size: 14px
}

#filtersModal .modal-dialog .shop-filters .filter-title {
background: none;
padding: 25px 30px;
text-align: left;
display: flex;
align-items: center;
justify-content: space-between;
box-shadow: 2px 2px 10px 0 #ccc;
font-size: 24px;
font-weight: 700;
text-transform: uppercase;
margin-left: 0
}

#filtersModal .modal-dialog .shop-filters .filter-section-header .showhide-indicator i {
color: #3dbbbb;
font-size: 1em
}

#filterswrapperhorizontal .filter-selected-row .filter-selected-group .sm-links {
display: flex;
align-items: center;
min-width: 10px;
border: 0 solid #e6e6e6;
padding: 5px 10px;
align-content: center;
margin-top: 4px;
border-radius: 0;
text-decoration-line: underline
}

@media only screen and (max-width: 1055px) {
#filterswrapperhorizontal .filter-selected-row {
margin-bottom: 5px;
display: grid;
justify-content: flex-start
} }

#filterswrapperhorizontal .filter-selected-row .filter-selected-group .sm-links:hover {
color: #000
}
.ms-thumb-frame {
width: 75px !important;
height: 75px !important;
background: white;
padding: 5px
}

.catalog-single .product-shopping-actions .buttons.group .qnt-count .inputquantity {
margin: 0;
height: 40px;
width: 40px;
font-size: 1em;
border: 1px solid #e5e5e5;
z-index: 1
}

.catalog-single .product-shopping-actions .buttons.group .qnt-count .incr-btn:first-child {
border-radius: 3px 0 0 3px
}

.catalog-single .product-shopping-actions .buttons.group .qnt-count .incr-btn {
background-color: #e6e6e6;
color: #454545;
height: 40px;
line-height: 40px;
font-size: .95em;
transition: all .35s;
width: 30px
}

.catalog-single .product-shopping-actions .buttons.group .qnt-count .incr-btn:hover, .catalog-single .product-shopping-actions .buttons.group .qnt-count .incr-btn:focus {
background-color: #3dbbbb;
color: #fff
}

.ex-product button.quoteme-button.btn.btn-outlined.btn-sm.btn-add-to-cart {
min-height: 25px;
padding-bottom: 5px;
background: #3dbbbb;
border: 0;
box-shadow: rgba(9, 30, 66, 0.25) 0 1px 1px, rgba(9, 30, 66, 0.13) 0 0 1px 1px;
font-weight: 400;
font-size: 12px;
text-transform: uppercase;
font-family: "Montserrat", sans-serif !important;
margin-top: 5px;
width: 80%;
color: #fff
}

.ex-product button.quoteme-button.btn.btn-outlined.btn-sm.btn-add-to-cart:hover {
    background: #878787;
    color: white
}

#quote-product-list-modal .qnt-count button, #sales-quote-list-modal .qnt-count button {
background-color: #9ce6ff;
color: #454545
}

#quote-product-list-modal .qnt-count button:not([disabled]):focus-visible, #quote-product-list-modal .qnt-count button:not([disabled]):hover, #sales-quote-list-modal .qnt-count button:not([disabled]):focus-visible, #sales-quote-list-modal .qnt-count button:not([disabled]):hover {
background-color: #3dbbbb
}

#quote-product-list-modal .qnt-count button:hover, #sales-quote-list-modal .qnt-count button:hover {
background-color: #3dbbbb
}

.col-md-12.product-shopping-actions-addtocart {
padding: 0;
margin-bottom: 2px
}

.ex-product button#addItemToCart {
box-shadow: rgba(9, 30, 66, 0.25) 0 1px 1px, rgba(9, 30, 66, 0.13) 0 0 1px 1px;
width: 80%
}

.catalog-single .prod-gal button.product-lightbox-open:before {
content: "Product Galley"
}

.catalog-single .prod-gal button.product-lightbox-open:hover:before {
right: calc(100% + 10px);
    width: 110px;
    opacity: 1
}

.catalog-single .prod-gal button.product-lightbox-open:before{
position: absolute;
    top: 5px;
    right: 0;
    width: 0;
    padding: 5px;
    background: #454545;
    border-radius: 3px;
    color: #fff;
    text-transform: uppercase;
    font-size: 10px;
    font-weight: 700;
    text-align: center;
    overflow: hidden;
    opacity: 0
}

.catalog-single .product-points ul li:before {
content: "";
background: #049acf;
width: 8px;
height: 8px;
margin-right: 10px;
display: inline-block;
flex-shrink: 0;
border-radius: 50%
}

.catalog-single .product-points ul li {
max-width: 95%;
font-size: .95em
}

.catalog-single .product-points .product-points-show-more{
color:#333
}

.catalog-single .product-points .product-points-show-more:hover {
color: #4797ce
}

.carousel-191434 .tile {
margin: 5px 4px!Important
}

.carousel-191434 .label-danger {
position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
    font-size: 14px;
    border-radius: 0 10px 0 30px;
    font-weight: 700;
    text-transform: none;
    color: #fff;
    height: 50px;
    padding: 10px 0 0 5px;
    width: 50px;
background: #3dbbbb
}

.option-group i.fa.fa-info-circle.has-tooltip {
display: none
}

body.ex-product .product-options {
padding: 0;
margin: 0;
text-align: left;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 12px;
  row-gap: 0
}

.product-options .option-group[data-name="Colour:"] {
  grid-column: 1 / -1
}

.product-options .option-group[data-type="6"] {
  grid-column: 1 / -1;
  width: 100%;
  display: block
}

body.ex-product .product-options .option-group label {
display: inline-flex
}

body.ex-product .product-options .option-group select {
width: 100%;
border-radius: 3px;
padding: .25rem;
font-size: 12px;
margin: 0;
border-color: #878787;
background: #ffffff
}

body.ex-product .product-options .option-group {
width: 100%;
align-items: baseline
}

body.ex-product .product-options .option-group label {
width: 100%;
font-size: 12px
}

.product-shopping-actions-prices .product-price-rrp {
font-size: 12px!Important;
text-align: left;
display: flex;
justify-content: center;
align-items: center
}

.product-shopping-actions-prices .product-price-rrp .rrp {
display: flex;
    flex-direction: row-reverse;
    justify-content: space-between
}

.ex-loggedout .catalog-single .softgraybackground.product-shopping-actions .product-shopping-actions-addtoquicklist a {
display: none
}

.TitleLinks {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 5px;
margin-bottom: 10px
}

.productsummary_container span.icons-together i.bigger.fa.fa-file-pdf-o {
color: #008080
}

@media (max-width: 450px) {
.col-sm-12 .productsummary_container {
padding: 0
} }

.excludeproducts {
font-size: 14px
}

#productshapshot table.items-list {
border: 0
}

.delivery-info-wrapper .delivery-info p.delivery-infotext {
margin: 0;
font-size: .8rem;
font-weight: 700;
text-transform: uppercase
}

.ex-product .delivery-info-wrapper .delivery-info .fa-truck:before {
font-size: 20px;
color: #3dbbbb
}

.ex-product .delivery-info {
display: flex;
justify-content: space-around;
align-items: center
}

.extend_del_Bannersgrey {
padding: 10px;
border-style: solid;
border-color: #0000001a;
border-width: 1px;
border-radius: 10px
}


/* ================================================
   COUNTY OFFICE SUPPLIES
   MODERN LOGIN MODAL - VERSION 3
   TWO ACCOUNT REGISTRATION OPTIONS
================================================ */


/* ================================================
   1. MODAL CONTAINER
================================================ */

.cosLoginModal .modal-dialog {
    width: 500px;
    max-width: calc(100% - 30px);
    margin: 40px auto;
}

.cosLoginModal .modal-content {
    display: block;
    height: auto;
    padding: 0;
    background: #ffffff;
    border: none;
    border-radius: 24px !important;
    box-shadow: 0 20px 65px rgba(0, 40, 40, 0.18);
    overflow: hidden;
}

.cosLoginModal .modal-header {
    position: relative;
    display: block;
    min-height: 0;
    padding: 0;
    border: none;
    background: #ffffff;
}

.cosLoginModal .modal-header h3 {
    display: none;
}

/* Close button */

.cosLoginModal .modal-header .close {
    position: absolute;
    top: 18px;
    right: 20px;
    z-index: 10;
    opacity: 0.7;
    color: #008080;
    font-size: 22px;
    transition: opacity 0.2s ease;
}

.cosLoginModal .modal-header .close:hover {
    opacity: 1;
}

.cosLoginModal .modal-header .close i:before {
    border: none;
    border-radius: 0;
    padding: 0;
    color: #008080;
    font-size: 20px;
}


/* ================================================
   2. MODAL BODY
================================================ */

.cosLoginModal .modal-body,
.cosLoginModal .modal-body.nFlex {
    display: block;
    height: auto;
    padding: 0px 30px 20px !important;
    box-sizing: border-box;
}

.cosLoginModal .LogRightModal {
    display: none !important;
}

.cosLoginModal .LogLeftModal {
    width: 100%;
    padding: 0;
    margin: 0;
}

.cosLoginModal .social-sign-in {
    display: none;
}


/* ================================================
   3. WELCOME HEADING
================================================ */

.cos-login-intro {
    margin-bottom: 24px;
    text-align: center;
}

.cosLoginModal .cos-login-icon {
    display: none !important;
}

.cos-login-intro h2 {
    margin: 0 0 8px;
    color: #1d2939;
    font-size: 28px;
    font-weight: 700;
    line-height: 1.3;
    text-transform: none;
    letter-spacing: -0.4px;
}

.cos-login-intro p {
    margin: 0;
    color: #667085;
    font-size: 14px;
    line-height: 1.5;
}


/* ================================================
   4. LOGIN FORM
================================================ */

.cosLoginModal form {
    padding: 0;
    margin: 0;
}

.cosLoginModal .form-group {
    margin-bottom: 16px;
}

.cosLoginModal form label:not(.control) {
    display: block;
    margin-bottom: 7px;
    color: #344054;
    font-size: 13px;
    font-weight: 600;
}

/* Input fields */

.cosLoginModal input[type="text"],
.cosLoginModal input[type="email"],
.cosLoginModal input[type="password"] {
    width: 100%;
    height: 46px;
    padding: 10px 14px;
    background: #ffffff;
    border: 1px solid #d0d5dd;
    border-radius: 14px !important;
    color: #1d2939;
    font-size: 14px;
    box-shadow: none;
    box-sizing: border-box;
    transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease;
}

.cosLoginModal input[type="text"]:focus,
.cosLoginModal input[type="email"]:focus,
.cosLoginModal input[type="password"]:focus {
    outline: none;
    border-color: #008080;
    box-shadow: 0 0 0 3px rgba(0, 128, 128, 0.12);
}

.cosLoginModal input::placeholder {
    color: #98a2b3;
    opacity: 1;
}

/* Remember me */

.cosLoginModal .control--checkbox {
    font-size: 13px;
    color: #475467;
}

.cosLoginModal .control--checkbox .control__indicator {
    border: 1px solid #d0d5dd;
    border-radius: 4px;
}


/* ================================================
   5. SIGN IN BUTTON
================================================ */

.cosLoginModal .cos-login-submit {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 46px;
    margin-top: 16px;
    padding: 11px 18px;
    background: #008080;
    border: 1px solid #008080;
    border-radius: 14px !important;
    color: #ffffff;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.4;
    text-align: center;
    text-transform: none;
    cursor: pointer;
    transition:
        background-color 0.2s ease,
        border-color 0.2s ease;
}

.cosLoginModal .cos-login-submit:hover,
.cosLoginModal .cos-login-submit:focus {
    background: #006666;
    border-color: #006666;
    color: #ffffff;
}


/* ================================================
   6. PASSWORD RESET & HELP LINKS
================================================ */

.cosLoginModal .help-link {
    color: #008080;
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    transition: color 0.2s ease;
}

.cosLoginModal .help-link:hover {
    color: #006666;
    text-decoration: underline;
}

/* Hide duplicate create account link */

#loginModal a.help-link.pull-right {
    display: none !important;
}

.cosLoginModal .help-link.pull-left {
    padding: 0;
    margin: 10px 0 0;
    float: none !important;
}


/* ================================================
   7. ACCOUNT REGISTRATION OPTIONS
================================================ */

.cos-login-options {
    margin-top: 4px;
}

/* Section heading with divider lines */

.cos-login-options-heading {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
    color: #667085;
    font-size: 12px;
    text-align: center;
}

.cos-login-options-heading::before,
.cos-login-options-heading::after {
    content: "";
    flex: 1;
    height: 1px;
    background: #eaecf0;
}

.cos-login-options-heading span {
    white-space: nowrap;
}

/* Two-column layout */

.cos-login-options-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

/* Shared account cards */

.cos-login-option {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 88px;
    padding: 15px 12px;
    border-radius: 14px;
    text-align: center;
    text-decoration: none !important;
    box-sizing: border-box;
    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        transform 0.2s ease;
}

.cos-login-option strong {
    display: block;
    margin-bottom: 5px;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.4;
}

.cos-login-option span {
    display: block;
    font-size: 11px;
    line-height: 1.5;
}

/* User account - solid teal */

.cos-login-option-user {
    background: #008080;
    border: 1px solid #008080;
    color: #ffffff;
}

.cos-login-option-user strong,
.cos-login-option-user span {
    color: #ffffff;
}

.cos-login-option-user:hover,
.cos-login-option-user:focus {
    background: #006666;
    border-color: #006666;
    color: #ffffff;
    transform: translateY(-2px);
}

/* Business account - soft teal */

.cos-login-option-business {
    background: #e6f5f5;
    border: 1px solid #cce8e8;
    color: #008080;
}

.cos-login-option-business strong {
    color: #006666;
}

.cos-login-option-business span {
    color: #567878;
}

.cos-login-option-business:hover,
.cos-login-option-business:focus {
    background: #d4eeee;
    border-color: #008080;
    color: #006666;
    transform: translateY(-2px);
}

/* Keyboard accessibility */

.cos-login-option:focus-visible {
    outline: 3px solid rgba(0,128,128,0.3);
    outline-offset: 3px;
}


/* ================================================
   8. CONTACT SUPPORT
================================================ */

.cos-login-options .cos-login-support {
    margin-top: 20px;
    margin-bottom: 0;
    color: #667085;
    font-size: 12px;
    line-height: 1.6;
    text-align: center;
}

.cos-login-support a {
    color: #008080;
    font-weight: 600;
    text-decoration: none;
}

.cos-login-support a:hover {
    color: #006666;
    text-decoration: underline;
}


/* ================================================
   9. TWO-STEP LOGIN
================================================ */

#usernamemodal .modal-dialog {
    text-align: left;
}

#usernamemodal .cos-login-intro {
    margin-bottom: 24px;
}

#usernamemodal .username-form {
    width: 100%;
}

#usernamemodal .cos-login-submit {
    margin-top: 18px;
}


/* ================================================
   10. TABLET
================================================ */

@media only screen and (min-width: 601px)
                   and (max-width: 768px) {

    .cosLoginModal .modal-dialog {
        width: 480px;
        max-width: calc(100% - 30px);
        margin: 30px auto;
    }

    .cosLoginModal .modal-body,
    .cosLoginModal .modal-body.nFlex {
        padding: 0px 26px 20px !important;
    }

    .cos-login-intro h2 {
        font-size: 27px;
    }
}


/* ================================================
   11. MOBILE
================================================ */

@media only screen and (max-width: 600px) {

    .cosLoginModal .modal-dialog {
        width: auto;
        max-width: calc(100% - 24px);
        margin: 20px auto;
    }

    .cosLoginModal .modal-content {
        border-radius: 20px !important;
    }

    .cosLoginModal .modal-body,
    .cosLoginModal .modal-body.nFlex {
        padding: 0px 22px 18px !important;
    }

    .cos-login-intro {
        margin-bottom: 22px;
    }

    .cos-login-intro h2 {
        font-size: 25px;
    }

    .cos-login-intro p {
        font-size: 13px;
    }

    .cosLoginModal .form-group {
        margin-bottom: 14px;
    }

    .cosLoginModal input[type="text"],
    .cosLoginModal input[type="email"],
    .cosLoginModal input[type="password"] {
        height: 46px;
    }

    .cos-login-options {
        margin-top: 20px;
    }

    .cos-login-options-grid {
        gap: 10px;
    }

    .cos-login-option {
        min-height: 88px;
        padding: 12px 9px;
        border-radius: 12px;
    }

    .cos-login-option strong {
        font-size: 12px;
    }

    .cos-login-option span {
        font-size: 10px;
    }

    .cos-login-options .cos-login-support {
        margin-top: 18px;
    }
}


/* ================================================
   12. SMALL MOBILE
================================================ */

@media only screen and (max-width: 380px) {

    .cosLoginModal .modal-body,
    .cosLoginModal .modal-body.nFlex {
        padding: 0px 18px 16px !important;
    }

    .cos-login-intro h2 {
        font-size: 23px;
    }

    .cos-login-intro p {
        font-size: 12px;
    }

    /* Stack account choices on narrow screens */

    .cos-login-options-grid {
        grid-template-columns: 1fr;
        gap: 9px;
    }

    .cos-login-option {
        min-height: 65px;
        padding: 10px 12px;
    }
}


/* ================================================
   13. REDUCED MOTION
================================================ */

@media (prefers-reduced-motion: reduce) {

    .cos-login-option,
    .cos-login-submit {
        transition: none;
    }

    .cos-login-option:hover {
        transform: none;
    }
}

/* ================================================
   COUNTY OFFICE SUPPLIES
   MODERN LOGIN MODAL - END
================================================ */

.sweet-alert button {
background-color: #9ce6ff
}

.sweet-alert button:hover {
background-color: #3dbbbb
}

@media screen and (max-width: 768px) {
.addtoquicklist-wrapper {
display:none
} }

@media screen and (max-width: 768px) {
.product-compare-action{
display:none
} }

.coslinks span {
    width: 2px;
    height: 13px;
    background: #3dbbbb;
    display: inline-block;
    vertical-align: middle;
    margin: 0 10px
}

.footSocial.fsPDP {
margin: 5px 0 0;
justify-content: center;
border: 1px solid #e6e6e6!important
}

.footSocial img {
width: 30px;
height: 30px
}

.footSoc {
position: relative;
display: flex;
align-items: center;
margin: 5px 0
}

.footSoc .fsImg {
width: 30px;
height: 30px;
transition: .35s all;
margin-right: 10px
}

.catalog-single .product-compare-action {
border-top: 0;
margin-top: 0
}

p.coslinks {
margin: 0
}

.coslinks {
font-size: .7em;
padding: 5px 10px 0
}

.catalog-grid .tile .product-compare-action, .catalog-grid .tile .footer .addtoquicklist-wrapper {
margin: 0;
padding: 0;
border: none;
font-size: 12px;
width: auto
}

.catalog-grid .tile .product-compare-action.selected .fa-check, .catalog-single .product-compare-action.selected .fa-check {
background: url(https://eu.evocdn.io/dealer/1022/content/media/co-plp-tick.png)no-repeat center;
bottom: 0;
left: -2px
}

.catalog-grid .tile .product-compare-action.selected .fa-check:before, .catalog-single .product-compare-action.selected .fa-check:before {
    font-size: 0
}

.catalog-grid .tile .product-compare-action i.fa-square-o:before, .catalog-grid .tile .footer .addtoquicklist-wrapper i:before {
content: ""
}

.catalog-single .product-compare-action .fa-square-o:before {
content: ""
}

.catalog-grid .tile .product-compare-action i.fa-square-o ,.catalog-single .product-compare-action .fa-square-o {
width: 15px;
height: 15px;
border: 1px solid #3dbbbb;
background: white;
border-radius: 2px
}

.catalog-single .product-shopping-actions .prodToolsWrap {
margin: 0;
    border: none;
    margin-left: auto;
    margin-right: auto;
    padding: 5px 17px;
border-radius: 0 0 10px 10px
}

.prodToolsWrap {
display: flex;
justify-content: space-between;
align-items: center
}

.catalog-single .product-shopping-actions-tierpricing .group-focus, .catalog-single .product-shopping-actions-tierpricing .arrow-down {
    display: none
}

.waviy h1 {
  text-transform: uppercase;
animation: flip 5s infinite;
animation-timing-function: linear
}
@keyframes flip {
  0%,80% {
    transform: rotateY(360deg)
  }
}

.productfinderwidget[data-widgetid='188726'] .finder-wrapper .finder-header span {
display: none
}

.mobile .productfinderwidget.default-styling .finder-wrapper .finder-header span {
margin-left: 0
}

/* Content menus */

.mobile .menulinks_container section.quicklinks .title {
    border-bottom: 0;
    margin-bottom: 5px;
    padding-bottom: 10px;
    padding-left: 10px;
    padding-top: 10px;
    background: #f3f3f3
}

.mobile .menulinks_container section.quicklinks li {
    border-bottom: 0;
    margin-bottom: 5px;
    padding-bottom: 10px;
    padding-left: 10px;
    padding-top: 10px;
    border-left: 3px solid;
    border-color: #878787;
    background: #f3f3f3
}

.mobile .menulinks_container section.quicklinks li:hover {
border-color: #3dbbbb
}

.mobile .menulinks_container li a:hover {
text-shadow: -1px 1px 2px #aaa;
color: #111
}

.cosbanner img{
margin-bottom: 20px;
    padding: 5px;
    border: 2px solid #d9d9d9;
    border-radius: 0;
    filter: brightness(0.9)
}

.deltable td {
padding: 10px
}

.delivery-services img {
    margin-bottom: 20px;
    padding: 2px;
    border: 1px solid #d9d9d9;
    border-radius: 5px
}

.googlemap {
padding: 15px;
background: #f3f3f3
}

section.coscontContent a {
color: #049acf;
font-weight: 700
}

.coscontTitle h1 {
margin: 0 0 20px;
color: #222
}

.coscontTitle p {
letter-spacing: 1px
}

.coscontTitle {
margin: 10px 10px 30px
}

.coscontContent p {
margin: 0 0 15px
}

.coscontContent h2 {
margin: 0 0 20px;
color: #222
}

#menulinks_101483.menulinks_container section.quicklinks .title  {
text-transform: capitalize!Important;
margin-left: 15px;
border-top: 1px solid #049af3;
margin-right: 15px;
padding-top: 15px
}

.menulinks_container li a{
color: #777
}

.menulinks_container li a:hover{
text-shadow: -1px 1px 2px #aaa;
color: #111
}

#menulinks_262574.menulinks_container li a, #menulinks_263469.menulinks_container li a, #menulinks_263503.menulinks_container li a, #menulinks_264278.menulinks_container li a, #menulinks_264826.menulinks_container li a,
#menulinks_265457.menulinks_container li a, #menulinks_269008.menulinks_container li a, #menulinks_269869.menulinks_container li a, #menulinks_269858.menulinks_container li a, #menulinks_274121.menulinks_container li a,
#menulinks_277017.menulinks_container li a, #menulinks_277363.menulinks_container li a, #menulinks_277377.menulinks_container li a, #menulinks_277356.menulinks_container li a
{
color: #454545
}

#menulinks_262574.menulinks_container section.quicklinks li, #menulinks_263469.menulinks_container section.quicklinks li, #menulinks_263503.menulinks_container section.quicklinks li, #menulinks_264278.menulinks_container section.quicklinks li,
#menulinks_264826.menulinks_container section.quicklinks li, #menulinks_265457.menulinks_container section.quicklinks li, #menulinks_269008.menulinks_container section.quicklinks li, #menulinks_269869.menulinks_container section.quicklinks li,
#menulinks_269858.menulinks_container section.quicklinks li, #menulinks_274121.menulinks_container section.quicklinks li, #menulinks_277017.menulinks_container section.quicklinks li, #menulinks_277356.menulinks_container section.quicklinks li,
#menulinks_277363.menulinks_container section.quicklinks li, #menulinks_277377.menulinks_container section.quicklinks li
{
font-size: 1.1em;
font-weight: 700;
background: #ffffff;
padding: 10px
}

#menulinks_262574.menulinks_container section.quicklinks li:after, #menulinks_263469.menulinks_container section.quicklinks li:after, #menulinks_263503.menulinks_container section.quicklinks li:after, #menulinks_264278.menulinks_container section.quicklinks li:after,
#menulinks_264826.menulinks_container section.quicklinks li:after, #menulinks_265457.menulinks_container section.quicklinks li:after, #menulinks_269008.menulinks_container section.quicklinks li:after, #menulinks_269869.menulinks_container section.quicklinks li:after,
#menulinks_269858.menulinks_container section.quicklinks li:after, #menulinks_274121.menulinks_container section.quicklinks li:after, #menulinks_277017.menulinks_container section.quicklinks li:after, #menulinks_277356.menulinks_container section.quicklinks li:after,
#menulinks_277363.menulinks_container section.quicklinks li:after, #menulinks_277377.menulinks_container section.quicklinks li:after
{
content: "\f054";
font: normal normal normal 12px / 1 FontAwesome;
float: right;
color: #454545
}

#menulinks_262574.menulinks_container section.quicklinks .title, #menulinks_263469.menulinks_container section.quicklinks .title, #menulinks_263503.menulinks_container section.quicklinks .title, #menulinks_264278.menulinks_container section.quicklinks .title,
#menulinks_264826.menulinks_container section.quicklinks .title, #menulinks_265457.menulinks_container section.quicklinks .title, #menulinks_269008.menulinks_container section.quicklinks .title, #menulinks_269869.menulinks_container section.quicklinks .title,
#menulinks_269858.menulinks_container section.quicklinks .title, #menulinks_274121.menulinks_container section.quicklinks .title, #menulinks_277017.menulinks_container section.quicklinks .title, #menulinks_277356.menulinks_container section.quicklinks .title,
#menulinks_277363.menulinks_container section.quicklinks .title, #menulinks_277377.menulinks_container section.quicklinks .title
{
font-size: 16px;
padding: 15px;
background: url(https://eu.evocdn.io/dealer/1022/content/media/dealsbk2.png) no-repeat center;
text-align: center;
border-radius: 5px;
margin-top: 10px;
margin-bottom: 15px;
color: #fff
}

div#menulinks_262574, div#menulinks_263469, div#menulinks_263503, div#menulinks_264278, div#menulinks_264826, div#menulinks_269008, div#menulinks_269869, div#menulinks_269858, div#menulinks_274121, div#menulinks_277017,
div#menulinks_277356, div#menulinks_277363, div#menulinks_277377
{
border-bottom: 1px solid #c6c6c6;
padding-bottom: 5px;
background: #ffffff
}

div#menulinks_265457 {
background: #ffffff;
border-style: solid;
border-color: #0000001a;
border-width: 1px;
border-radius: 10px;
padding: 5px 10px
}

.productfinderwidget .finder-wrapper .finder-select-wrapper .dropdown-arrow b, .productfinderwidget .finder-wrapper .finder-select-wrapper .select2-selection__arrow b {
border-color: #3dbbbb transparent
}

.productfinderwidget .finder-wrapper {
margin: 8px 0
}

.productfinderwidget.default-styling .finder-wrapper .finder-select-wrapper.dropdown:hover {
box-shadow: rgba(0, 0, 0, 0.16) 0 1px 4px
}

.productfinderwidget.default-styling .finder-button:hover {
box-shadow: rgba(0, 0, 0, 0.16) 0 1px 4px
}

.productfinderwidget.default-styling .finder-wrapper .finder-header span {
vertical-align: bottom
}

.productfinderwidget .finder-wrapper {
border: 1px solid #b3b3b3
}

@media screen and (min-height: 768px) {
#productfinder_187935 .productfinderwidget.default-styling .finder-wrapper .finder-header h1 {
font-size: 1.6em
} }

.productfinderwidget.default-styling .finder-wrapper {
background: url(https://eu.evocdn.io/dealer/1022/content/media/cosbk10.png)no-repeat center;
background-size: cover;
background-attachment: fixed;

padding: 1.2em 2.5em
}

.productfinderwidget form .form-group>label {
margin-left: 3px
}

#productfinder_188151 .finder-header h1 {
font-size: 2em!Important;
text-align: center;
line-height: 1em;
text-transform: capitalize;
text-shadow: 0 0 5px #ffffff
}

#productfinder_188151 .finder-header span {
margin-left: auto
}

/* Product Finders - end */

@media screen and (min-width: 768px) {
.bloghome .bloglatestposts_container .blog-posts-grid .post-excerpt{
margin: .5em 0
} }

.blogpostslist_container .tileparent .tile {
text-align: left
}

@media screen and (min-width: 768px) {
.bloghome .post-row.tileparent.clearfix {
max-height: 240px;
min-height: 240px
} }

.checkout-spinner {
background-image: url('https://eu.evocdn.io/dealer/1022/content/media/COSLoading.gif');
background-repeat: no-repeat;
background-size: auto;
width:300px;
height: 300px;
position: relative
}

@media screen and (max-width: 767px) {
.catalog-single .product-title {
padding: 10px
} }

@media screen and (min-width: 768px) {
.bloghome .post-excerpt  {
max-height: 110px;
overflow: hidden;
margin: 0 0!Important
} }

.cart-dropdown .header .btn {
display: none!Important
}

@media screen and (max-width: 767px) {
.productdetails .product-stock {
    padding-top: 0;
    display: flex;
    justify-content: space-around
} }

@media screen and (max-width: 767px) {
.catalog-single .product-summary .productdetails .margindiv {
    padding-top: 0;
    display: flex;
    justify-content: center
} }

.productdetails .product-stock .out-stock {
color: #454545;
font-size: 14px
}

.productdetails .product-stock .out-stock small {
padding-left: 5px;
color: #000000 ! Important;
font-weight: 700;
margin-left: 5px
}

.catalog-single .product-brand a {
font-weight: 400
}

.catalog-single .product-points {
margin: 0
}

.catalog-grid .out-stock .small, small {
font-weight: 400
}

.mainMenuNav {
font-weight: 800;
text-align: center;
transition: .35s all;
border-radius: 5PX;
display: flex;
align-items: center;
justify-content: space-evenly;
margin: 0;
background: #e6e6e6;
color: #000;
font-size: 14px;
height: 42px;
width: 70px;
box-shadow: rgba(0, 0, 0, 0.12) 0 1px 3px, rgba(0, 0, 0, 0.24) 0 1px 2px
}

.mainMenuNav:hover {
background: #3dbbbb
}

.mainMenuNav a:before {
content: "\f039";
font: normal normal normal 14px/1 FontAwesome;
color: #454545;
margin-right: 5px;

}

.mainMenuNav a {
font-weight: 700;
color: #000
}

.fa-lightbulb:before {
    content: "\f0eb"
}

/* sidebar nav */

.sideList {
margin: 10px 0;
padding: 0;
list-style: none;
display: flex;
flex-wrap: wrap;
z-index: 10;
position: relative
}

 /* The side navigation menu */
.sidenav {
  height: 100%; /* 100% Full-height */
  width: 0; /* 0 width - change this with JavaScript */
  position: fixed; /* Stay in place */
  z-index: 50; /* Stay on top */
  top: 0; /* Stay at the top */
  left: 0;
  overflow-x: hidden; /* Disable horizontal scroll */
  padding-top: 0; /* Place content 60px from the top */
transition: all .3s ease-in-out;
background: #f5f5f5;
box-shadow: 12px 0 23px -15px rgba(0, 0, 0, .75)
}

.sideList ul {
margin-bottom: 15px
}

.sideList h3 {
margin: 0;
margin-bottom: 5px
}

h4.sideNavMainh {
font-size: 24px ! Important;
margin: 0 ! Important;
padding: 40px 10px 20px 32px;
white-space: nowrap
}

.sidenav ul.sideMainLinks a:after {
content: "\f054";
font: normal normal normal 12px/1 FontAwesome;
float: right;
color: #f5f5f5;
margin-right: 40px
}

.sidenav ul.sideMainLinks a:hover:after {
color: #3dbbbb
}

.sidenav h2 {
white-space: nowrap;
font-size: 24px;
position: relative;
z-index: 10;
margin: 0;
padding: 40px 10px 20px 32px
}

.sidenav h3 a {
font-size: 16px;
padding-left: 34px;
color: #3dbbbb!Important;
white-space: nowrap
}

.cd-dropdown-trigger {
background-color: #878787!important;
font-size: 1em
}

section.search .search-form button[type=submit]:hover {
background: #3dbbbb
}

.blogfeaturedposts_container .blog-posts-grid .post-name h4 {
font-size: 1em
}

.blogfeaturedposts_container .blog-posts-list-view .tileparent .post-content .bottom {
font-size: .9em
}

.catalog-grid .tile .footer .buttons.group {
margin-bottom: 0;
margin-top: 0;
padding: 10px
}

.catalog-grid .tile .footer button.is-master {
min-width: 100%;
background: #3dbbbb
}

.catalog-grid .tile .footer button.is-master:hover {
background: #049af3
}

body.product .twocolumnsright .col-lg-2{background: #ffffff;border-radius: 0;padding-left: 5px;padding-right: 5px;border: 0}

.extend_del_Banners {
border: 1px solid #e6e6e6!important;
max-width: none;
border-radius: 10px;
padding: 3px;
box-shadow: rgba(50, 50, 93, 0.25) 0 6px 12px -2px, rgba(0, 0, 0, 0.3) 0 3px 7px -3px
}

.extend_del_Banners img {
border-radius: 10px
}

@media only screen and (max-width: 767px){
body > header {
    position: sticky;
    top: 0;
    z-index: 21;
    transition: background .35s
} }

.imgthumbnail {
display: flex;
align-content: center;
justify-content: center;
align-items: center
}

.relationship-carousel .owl-nav  {
height: 0
}

.item-merchandising h3, .products-related h3, .productsrelated h3 {
margin-right: 0
}

.productsrelated .product-price-rrp {
display: none
}

.widget-lastviewedproducts-html .owl-nav .owl-next:hover:before{
color: #3dbbbb
}

.widget-lastviewedproducts-html .owl-nav .owl-prev:hover:before{
color: #3dbbbb
}

.catalog-single.has-carousel .owl-next {
right: 15px
}

.catalog-single.has-carousel .owl-prev {
right: 30px
}

.owl-carousel .owl-dot, .owl-carousel .owl-nav .owl-next, .owl-carousel .owl-nav .owl-prev {
    top: -15px;
    padding: 0;
    display: flex;
    align-items: center
}

.widget-contract-items-html .owl-nav .owl-next, .widget-contract-items-html .owl-nav .owl-prev, .widget-lastviewedproducts-html .owl-nav .owl-next, .widget-lastviewedproducts-html .owl-nav .owl-prev {
color: #333
}

.widget-contract-items-html .tile .imgthumbnail, .widget-lastviewedproducts-html .tile .imgthumbnail {
border-radius: 0;
display: inline-block;
margin: auto;
max-height: 150px;
max-width: 150px;
vertical-align: middle;
padding: 10px
}

.widget-contract-items-html .tile, .widget-lastviewedproducts-html .tile {
padding: 0
}

.catalog-single.has-carousel .owl-next, .catalog-single.has-carousel .owl-prev {
background: none;
margin-top: -18px;
padding: 15px;
position: absolute
}

.catalog-single.has-carousel .owl-prev {
right: 25px;
top: -27px;
left: unset
}

.catalog-single.has-carousel .owl-next, .catalog-single.has-carousel .owl-prev {
    top: -28px;
    padding: 0;
    display: flex;
    align-items: center
}

.product-shopping-actions-prices .product-price-rrp {
margin-top: .2em
}

.bulkbuyright .form-group1 {
margin-bottom: 5px
}

.form-control, #quote-product-list-modal .select2-selection--single {
    border: 1px solid #878787;
    border-radius: 5px
}

.shopping-cart table td.qnt-count .incr-btn:hover {
background: #3dbbbb!important
}

.cart-dropdown .footer .btn.btn-outlined-invert.btn-block.to-checkout  {
background: #9ce6ff
}

.cart-dropdown .footer .btn.btn-outlined-invert.btn-block.to-checkout:hover  {
background: #3dbbbb
}

.shopping-cart .to-checkout {
background: #008080;
color:#fff;
text-transform: capitalize
}

.shopping-cart .to-checkout:hover {
background: #3dbbbb;
color:#fff
}

.cart-dropdown .footer .btn:hover {
background: #3dbbbb
}

.mobhomeStrip {
    background: #e6e6e6;
    padding: 10px 5px;
    margin-top: 10px
}

.HomeBG {
    background: url(https://eu.evocdn.io/dealer/1022/content/media/cosbk10.png)no-repeat center;
    background-size: cover;
    background-attachment: fixed;
filter: brightness(1.03)
}

.mobstripBox{
text-align: center;
    display: flex !important;
    justify-content: center
}

.nFlex-center {
  display: flex;
  justify-content: center;
  align-items: center
}

.catalog-name {
color: #222
}

.coIcon {
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
z-index: 1
}

section.quicklinks ul {
font-size: .9rem
}

.coIcon img {
margin-bottom: 10px;
filter: drop-shadow(2px 2px 2px #444444);
width: 60px
}

.container-fluid.headersection-5 {
background:#ffffff;
height: 40px
}

@media only screen and (min-width : 768px) {
.headersection-4 {
display: none
} }

footer .menulinks_container ul li a {
background: url(https://eu.evocdn.io/dealer/1022/content/media/cosbulletpoint.png) no-repeat scroll left center
}

.blogfeaturedposts_container .blog-posts-grid>h4 {
background: #f5f5f5;
border-radius: 0;
font-size: 1.2rem;
font-weight: 900;
letter-spacing: 0;
padding: 10px 15px;
text-align: center;
border: 1px solid #c6c6c6!Important;
padding-bottom: 10px!Important
}

#vuequicklistdropdown .dropdown-menu li a {
min-width: 150px
}

@media only screen and (max-width : 767px) {

.brands_container .owl-carousel .owl-nav{
display: none
}

.owl-carousel .tile .footer-wrapper span {
display: flex;
order: -1;
gap: 3px
}

.brands_container .catalog-single .tile img {
max-width: 100px;
max-height: 100px
}

.brands_container .catalog-single.has-carousel .tile, .catalog-single.has-grid .tile{
min-width: 160px;
max-width: 160px
}

.brands_container .owl-carousel.owl-drag .owl-item .imgthumbnail {
border: 0 solid #ccc;
background: #f3f3f3!Important;
height: 120px;
padding: 0
}

.brands_container .catalog-single.has-carousel .tile {
margin: 0;
border-right: 0 solid #3dbbbb ! Important
}

.brands_container .catalog-single .brandmerchandising-carousel .tile img {
filter: grayscale(1);
margin: auto;
padding: 0
}

.brands_container .catalog-single .brandmerchandising-carousel .tile img:hover {
filter: none;
transform: scale(1.3);
transition: transform .35s
}

.brands_container .brandmerchandising-carousel .owl-carousel .owl-stage-outer  {
margin-left: 0;
margin-right: 0;
background: #f5f5f5
}

.brands_container .brandmerchandising-carousel .inner  {
max-width: 100%
}

.brands_container .catalog-single.has-carousel {
border-bottom: 0;
margin-top: 0;
margin-bottom: 0;
padding: 0
}

.brands_container .sidebar-content  {
background: #f5f5f5
}
}

.HomeBannerEffects{
border: 1px solid #b3b3b3!important
}

.singlebanner_wrapper .HomeBannerEffects {
margin-bottom: 20px!Important
}

div#vuequicklistdropdown {
text-transform: capitalize;
font-size: 15px;
margin-left: -10px
}

.dropdown .pointer:hover {
background: #e6e6e6
}

.dropdown .pointer:hover a {
color: #111!Important
}

.vuequicklistdropdown_elem .fa-list-alt:before {
display: none
}

.dropdown-menu {
min-width: 200px
}

div#categoryfiltermenu_170045 .shop-filters .filter-section {
margin: 10px 0
}

.ASP p {
font-size: .85em!Important
}

.nLinkArea {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0
}

.mobilecatsection {
flex-wrap: wrap;
margin-top: 20px
}

.mobilecatbox {
width: calc(50% - 5px);
margin-bottom: 10px;
box-shadow: rgb(0 0 0 / 24%) 0 3px 8px
}

.mobilecatsection .mobilecatbox figcaption, .mobilecatsection .mobilecatbox figcaption>a {
position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

@media only screen and (max-width: 767px) {
.ex-home .page-content.mobile .row .singlebanner_container {
display: none
} }

/* Footer Updates 2022 Part 2 */

.footersection-2 .nFlex h4 {
color: #555
}

@media screen and (min-width: 768px) {
.footersection-2 .nFlex{flex-direction:row}
.nFoot1{width:20%}
.nFoot2{width:20%}
.nFoot3{width:20%}
.nFoot4{width:40%}
}

.nFoot1 .contact-block p {
font-size: 14px
}

.nFoot1 .contact-block {
    display: flex;
    align-items: baseline
}

.nFoot1 .contact-element.contact-icon {
    font-size: 1.5em;
    margin-right: 10px;
    display: block
}

.footersection-2 .nFoot1 .contact-block img {
width: 20px;
position: relative;
top: 0
}

.footersection-2 .contact-block ul {
font-size: 14px;
line-height: 1rem;
list-style: none;
margin: 0;
padding: 0;
margin-top: 10px
}

@media (min-width: 1024px) {
footer .menulinks_container ul li a:after {
content: "\f054";
font: normal normal normal 12px/1 FontAwesome;
float: right;
color: #333
} }

.footersection-2 .footLogo {
margin-bottom: 15px;
width: 75%
}

@media only screen and (max-width: 767px){
.nFoot1 .mobfootLogo {
padding: 10px 0
} }

@media only screen and (max-width: 767px){
footer .footersection-2 {
padding-top: 20px;
padding-bottom: 20px;
background: #008080!Important
} }

@media only screen and (max-width: 767px){
.footersection-4 {
padding: 5px 0
} }

@media only screen and (max-width: 767px){
footer .quicklinks {
padding-top: .5em
} }

@media only screen and (max-width: 767px) {
footer .menulinks_container ul li a:after {
content: "\f105"!Important;
font-family: FontAwesome!Important;
font-style: normal!Important;
float: right;
font-size: 20px;
color: #3dbbbb
} }

@media only screen and (max-width: 767px) {
footer .menulinks_container ul li a {
display: block;
color: #fff;
margin: 5px 0;
background: none;
text-align: left;
border: 1px solid #555555;
padding: 15px;
border-radius: 5px;
line-height: 1.2em;
font-weight: 400
} }

@media only screen and (min-width: 768px) {
footer .menulinks_container ul li a {
padding: 6px 0;
display: block;
color: #222;
padding-left: 20px;

} }

@media (max-width: 767px){
.nfc p{margin-bottom:0}
.nfc .row>div{margin-bottom:20px}
.nfc .contacts p{margin-bottom:0}

@media only screen and (max-width: 768px) {
.nfc p{margin-left:0;margin-right:0}
}

@media (max-width: 1366px) {
.nfc{
 padding:0 25px
} }

@media (max-width: 767px) {
.nfc{
 padding:0
} }

.nFoot1 .contact-block {
display: flex
}

@media only screen and (max-width :  767px) {
.mobAccord .accordList h4 { cursor: pointer; background: #3dbbbb; margin:0; border: 1px solid #008080; padding: 15px; border-radius: 5px; color:#fff; font-size:14px; font-weight:400; display:flex; justify-content:space-between; align-items:center }
.mobAccord ul { max-height: 0; overflow:hidden; transition: max-height 1s ease-out; padding:0}
.mobAccord .accordList.open ul { height:auto; max-height: 1000px; transition: max-height 1s ease-in-out !important }
section.quicklinks ul {margin-left: 0}
}
.mobAccord ul li{
margin:0 !important;
padding:0 !important;
border:none !important;
display:block !important
}

.mobAccord .accordList h4:after {
content: "\f107"!Important;
font-family: FontAwesome!Important;
font-style: normal!Important;
float: right;
color: #fff;
font-size: 20px
}
.mobAccord .accordList.open h4:after {
content: "\f106"!Important;
font-family: FontAwesome!Important;
font-style: normal!Important;
float: right;
color: #fff;
font-size: 20px
}
.mobAccord ul li:last-child{
margin:0 0 20px !important
}

.mobAccord ul li .footemail a{
display: block;
font-size: 14px;
color: #fff;
margin: 5px 0;
background: none;
text-align: left;
border: 1px solid #555555;
padding: 15px;
border-radius: 5px;
line-height: 1.2em;
font-weight: 400
}

.mobAccord ul li .footTel a:before{
content: "\f095"!Important;
font-family: FontAwesome!Important;
font-style: normal!Important;
float: right;
font-size: 20px;
color: #3dbbbb
}

.mobAccord ul li .footemail a:before{
content: "\f0e0"!Important;
font-family: FontAwesome!Important;
font-style: normal!Important;
float: right;
font-size: 20px;
color: #3dbbbb
}

.mobAccord .accordList h4:hover {
background: #333333
}

.mobAccord ul li .footTel a:hover {
color: #333
}

.mobAccord ul li .footemail a:hover {
color: #333
}
.mobAccord ul li .footTel a{
display: block;
font-size: 14px;
color: #fff;
margin: 5px 0;
background: none;
text-align: left;
border: 1px solid #555555;
padding: 15px;
border-radius: 5px;
line-height: 1.2em;
font-weight: 400
} }

/* Footer Updates 2022 Part 2 -end */

/* Footer Updates 2022 */

.menu ul.catalog>li.has-submenu>a {
letter-spacing: .01rem;
font-weight: 400
}

.menu ul.catalog>li.has-submenu>a:after {
    content: "\f107";
    color: #3dbbbb;
    margin-left: 5px;
    font: normal normal normal 12px/1 FontAwesome
}

.menu .catalog-block {
white-space: nowrap
}

.menu .catalog>li {
height: 40px;
list-style-type: none;
background: none;
align-items: center;
justify-content: center
}

footer .container-fluid.footersection-3 {
padding: 10px 0
}

@media only screen and (min-width: 768px){
.cos-cont-30 {
width: 30%
} }

@media only screen and (min-width: 768px){
.cos-cont-50 {
width: 50%
} }

@media only screen and (max-width: 767px){
.cos-cont-30 {
width: 90%;
padding: 12px 0
} }

@media only screen and (max-width: 767px){
.cos-cont-50 {
width: 90%
} }

.cos-cont-20 {
width: 20%
 }

@media only screen and (max-width: 767px){
.footMC {
flex-direction: column
} }

@media only screen and (max-width: 991px){
.footMC {
justify-content: center;
text-align: center
} }

.footSocial .soc-fb img,
.footSocial .soc-tw img,
.footSocial .soc-in img {
    background: #3dbbbb
}

.text-MC1 {
color: #1a1a1a;
font-size: 14px
}

footer p {
line-height: 20px
}

footer .footersection-5 .row {
padding-bottom: 0
}

.footMC #mc_embed_signup {
    padding: 0
}

.footMC .mc-field-group {
    position: relative;
    display: flex;
    gap: 5px
}

.footMC #mc_embed_signup input[type="email"] {
    border-radius: 5px;
    background: #fff;
    color: #181818;
    position: relative;
    padding: 5px 15px;
    height: 42px;
    font-size: 14px;
    border: none
}

#mc_embed_signup input[type="submit"] {
    font-weight: 700;
    color: #3a3a3a;
    border-radius: 5px;
    text-align: center;
    text-transform: uppercase;
    margin: 0;
    line-height: 1;
    height: auto;
    transition: .35s background;
  background: linear-gradient(to bottom, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%)
}

#mc_embed_signup input[type="submit"]:hover {
    background: #3dbbbb
}

.footSocial .cosSocial {
    max-width: 150px;
    margin: 0
}

.cosSocial{
width: 100%
}

.cosSocial img {
transition: .35s all;
width: 35px
}

.newsletter_title {
    font-size: 1.4em;
    text-transform: uppercase;
    font-weight: 700;
    padding-bottom: 4px;
    color: #fefefe
}

@media only screen and (max-width: 767px){
.coscards img {
width: 45%
} }

@media only screen and (min-width: 768px){
.coscards img {
padding: 0;
width: 30%
} }

@media only screen and (max-width: 767px) {
.coscards {
padding: 10px 0
} }

@media only screen and (min-width: 768px) {
.coscards {
display: flex;
justify-content: flex-end
} }

.container-fluid.footersection-5 {
background: #878787;
padding: 0
}

footer .footBot a:hover {
color: #111
}
footer .footBot a {
color: #fff
}

@media only screen and (max-width: 767px){
.nFlex li.mobile {
white-space: nowrap
} }

@media only screen and (max-width: 767px){
.nFlex li:nth-child(2) {
display:none
} }

.footBot footer a, footer label {
color: #fff
}

footer .footBot ul {
list-style: none;
margin: 0;
padding: 0
}

footer ul, footer ol {
font-size: 16px;
font-weight: 400;
line-height: 1.7
}

@media only screen and (max-width: 767px) {
.footMobSocial a {
display: inline-block;
margin: 0 5px
} }

footer .footBot ul li {
margin: 0;
padding: 0;
color: #fff;
font-size: 12px;
display: inline-block;
vertical-align: middle;
white-space: nowrap
}

footer .footBot ul .footDivide {
width: 1px;
height: 13px;
margin: 0 5px;
background: #ffffff
}

@media only screen and (max-width: 767px){
.footMobSocial {
padding-bottom: 5px;
margin-bottom: 5px
} }

@media only screen and (max-width: 991px) {
.footBot .nFlex {
flex-direction: column
} }

@media only screen and (max-width: 767px){
footer .footBot ul {
margin: 0;
line-height: 1.3
} }

/* Footer Updates 2022 -end */

.listtools {
padding: 15px 20px;
border-top: 1px solid #878787;
margin: 0 .5em
}

.desktop .productaddtocart_container .product-stock {
margin: 0;
padding: 0
}

.catalog-grid .tile .footer .addtoquicklist-wrapper {
float: left
}

.fa-shopping-cart:before {
content: "\f291"
}

.product-compare-action {
font-size: .8em;
margin-left: 4px
}

.addtoquicklist-wrapper .fa-plus:hover {
    transform: scale(1.3)
}

.addtoquicklist-wrapper .fa-plus {
    transition: all .5s ease-out
}

.catalog-grid .tile .footer .addtoquicklist-wrapper .fa-plus:before {
content: "\f004"!Important;
color: #3dbbbb;
margin-right: 3px
}

.catalog-grid .tile .footer .addtoquicklist-wrapper .fa-plus:hover:before {
color: #0082ad
}

.product-compare-action .fa-stack  {
height: 1.5em;
line-height: 1.5em;
width: 1.5em;
margin-right: 2px
 }

.fa-check:before {
color: #3dbbbb
}

/* Mobile Changes */

.MList li {
margin: 0;
padding: 0
}

.MList {
margin: 0 15px;
padding: 0;
list-style: none
}

@media only screen and (max-width: 768px){
header .header-mobile .logo img {
max-width: 175px
} }

media only screen and (max-width: 568px)
.header-mobile a i {
background-size: 30px 30px !important
}

.header-mobile .header-logo {
    display: flex;
    justify-content: center;
    align-items: center
}

/* Mobile Changes -end */

col-lg-2.col-md-1.col-sm-12.addcartbtn {
display: none
}

.listtools {
border: 1px solid #e6e6e6;
gap: 10px 0;
display: flex;
justify-content: space-between;
align-items: center;
background: #ffffff;
border-radius: 10px
}

@media only screen and (max-width: 768px){
.listtools {
display: block} }

.itemsfound b {
color: #222
}

.itemsfound b::before {
content: "["
}

.itemsfound b::after {
content: "]"
}

.shop-filters .text-center.small {
color: #2c3949;
padding: 10px;
border-radius: 0;
text-align: center;
background: #ffffff;
font-size: 16px;
width: 100%;
font-style: italic;
border-left: 1px solid #bfe8e8;
border-right: 1px solid #bfe8e8
}

.shop-filters .filter-title {
text-align: center;
position: static;
padding: 20px 20px 15px;
font-size: 1.6rem;
border: 1px solid #bfe8e8;
border-radius: 8px 8px 0 0
}

.catalog-grid .tile .footer .brand-label a {
text-transform: capitalize;
    font-weight: 700;
    color: #049acf !important;
    font-size: 13px;
    padding: 5px;
    display: flex;
    justify-content: center;
    align-items: center;
    max-height: 40px;
    border-top: 1px solid #b2b2b2;
    border-bottom: 1px solid #b2b2b2
}

.catalog-grid .tile .footer .brand-label a:before {
content: "Brand:";
margin-right: 4px;
color: #454545
}

@media only screen and (max-width: 768px) {
.imgthumbnail {
height: 160px;
margin: 0 auto;
width: auto
} }

.imgthumbnail.imglightbox {
display: flex;
justify-content: center;
align-items: center
}

.quicklistsedit .imgthumbnail {
    display: flex;
    align-content: center;
    justify-content: center;
    align-items: center
}

header .header-mobile .cd-dropdown-trigger-mobile i, header .header-mobile .header-right a {
color: #111
}

.label-danger {
color: #454545
}

@media only screen and (max-width: 768px) {
.catalog-grid .tile .footer .product-shopping-actions-tierpricing span.price {
font-weight: 700;
font-size: 18px
} }

@media only screen and (max-width: 768px) {
.tile .product-shopping-actions-tierpricing{
background: #ade3fe3d;
    text-align: center;
    margin-top: 5px;
    display: flex;
    flex-direction: row-reverse;
    justify-content: center;
    padding: 5px 20px;
    line-height: 1.2em;
    border: 1px solid #3dbbbb
} }

@media only screen and (max-width: 768px) {
.plpTools.nFlex {
display: none
} }

@media only screen and (max-width: 375px) {
header .header-mobile .logo img {
max-width: 150px
} }

.product-shopping-actions-tierpricing.live-pricing-fallback-option-evox.product-tile .qty {
display: none
}

.header-mobile .searchtools {
    z-index: 10;
    position: relative;
    right: 0;
    opacity: 1;
    height: auto;
    box-shadow: none
}

@media only screen and (min-width: 769px) {
.category-link{
transition: all .3s linear;
border-bottom: 0;
margin-bottom: 5px;
padding-bottom: 5px;
padding-left: 11px;
padding-top: 5px;
border-left: 6px solid;
margin-left: 0;
border-color: #e6e6e6
} }

@media only screen and (min-width: 769px) {
.shop-filters .filter-section .categories li {
    line-height: .8em;
    list-style: none;
    font-size: unset
} }

@media only screen and (min-width: 769px) {
.category-link:hover{border-color:#3dbbbb}
}

.clean-search:before {
content: "Refine Your Search";
display: block;
text-align: center;
color: #008080;
font-weight: 700;
font-size: 16px;
margin-top: 10px
}

.shop-filters {
background: #ffffff;

}

.quicklinks-custom {
    padding-top: 5px;
    margin-top: -7px;
    background: #ffffff
}

/* Blog Changes */

.footer3txt {
color: #fff
}

footer a:hover {
text-decoration: none
}

footer .menulinks_container ul li a:hover {
color: #000;
text-shadow: -1px 1px 2px #aaa
}

footer .menulinks_container ul li a:hover:after {
text-shadow: none
}

.bloglatestposts_container .blog-posts-grid[data-parentname=sidebarright] .blog-posts-list-view .blog-post .post-row {
margin-bottom: 1em
}

@media (min-width: 768px) {
.post-row.tileparent.clearfix {
border: 1px solid #b3b3b3;
padding: 5px
} }

.bloglatestposts_container .blog-posts-grid[data-parentname=sidebarright] h4 {
font-size: .9em
}

section.quicklinks ul .blogmenu {
font-size: 16px
}

@media (min-width: 768px) {
.blogpage {
margin-top: -30px
} }

@media (min-width: 768px) {
.blogsearch_container .widget-blogs-search {
margin-bottom: 1em;
margin-top: 30px
} }

@media (min-width: 768px) {
.blogmenuhome {
margin-top: -15px
} }

.menulinks_container li.blogmenu a {
color: #777
}

.menulinks_container li.blogmenu a:hover {
color: #111;
font-weight: 500
}

.menulinks_container li.blogmenu {
border-bottom: 0;
margin-bottom: 5px;
padding-bottom: 10px;
padding-left: 10px;
padding-top: 10px;
border-left: 3px solid;
margin-left: 0;
border-color: #878787;
background: #f3f3f3
}

.menulinks_container li.blogmenu:hover {
border-color: #3dbbbb
}

.blogpostslist_container .listtools .listgrid .btn {
border-radius: 0
}

@media (min-width: 768px) {
.blogpostslist_container .listtools .listgrid {
display: inline
} }

.blogpostcontent_container h3 {
text-transform: capitalize
}

.blog-post-details .post-title  {
margin-bottom: 20px
}

.blog-post-details .post-category {
font-weight: 700;
text-transform: uppercase;
border-top: 1px solid;
border-bottom: 1px solid;
padding: 15px 0;
font-size: 20px;
margin-bottom: 20px;
color: #878787;
margin-top: 20px
}

.bloglatestposts_container .blog-posts-grid[data-parentname=sidebarright] .blog-posts-list-view .blog-post .post-row .post-details {
font-size: small
}
@media (min-width: 768px) {
.blogpostslist_container .listtools {
margin: 0 15px;
background: #f3f3f3;
height: 46px
} }

.ex-blog .categoryfiltermenu_container .shop-filters .filter-section ul li.category-link {
border-bottom: 0;
margin-bottom: 5px;
padding-bottom: 10px;
padding-left: 5px;
padding-top: 10px;
border-left: 6px solid;
margin-left: 0;
border-color: #878787;
background: #f3f3f3
}

.ex-blog .categoryfiltermenu_container .shop-filters .filter-section ul li.category-link:hover {
border-color: #3dbbbb
}

.ex-blog .categoryfiltermenu_container .shop-filters .filter-section .categories li a {
color: #777
}

.shop-filters .filter-section .categories li {
line-height: .8em
}
.ex-blog .categoryfiltermenu_container .shop-filters .filter-section .categories li a:hover {
color: #111;
font-weight: 700
}

.shop-filters .filter-section .categories li a {
color: #454545;
line-height: 1.6em
}

.shop-filters .filter-section .categories li a:hover {
color: #111;
text-shadow: -1px 1px 2px #aaa
}

.shop-filters .filter-section .categories  {
margin-left: 10px
}

.blogfeaturedposts_container .tileparent .tile, .bloglatestposts_container .tileparent .tile, .blogpostslist_container .tileparent .tile  {
padding-right:10px
}

.ex-blog .categoryfiltermenu_container .shop-filters .filter-title {
border-radius:0;
border-top: 0
}

.shop-filters .filter-title {
background-color: #d1efef;
color: #008080
}

.blogsearch_container .search-form .form-control, .blogsearch_container .search-form .select2-selection--single  {
border: 1px solid #c6c6c6;
border-radius: 5px;
background: #ffffff url(https://eu.evocdn.io/dealer/1022/content/media/COSSearchMag.svg)no-repeat left 15px center;
background-size: 22px 22px;
padding: 0 0 0 45px
}

.blogsearch_container .search-form button[type=submit] i  {
display:none
}

.blogsearch_container .search-form button[type=submit] {
top: 2px;
height: 42px;
width: 42px;
padding: 8px;
background: #878787;
border-radius: 50%;
text-align: center;
right: 2px;
font-size: 14px;
color: #fff;
font-weight: 700;
border: 3px solid #ffffff
}

.blogsearch_container .search-form button[type=submit]:before {
content: "Go";
text-transform: uppercase;
line-height: 14px
}

.bloglatestposts_container .blog-posts-grid[data-parentname=sidebarright] .blog-post .tile {
font-size: .8em
}

/* Blog Changes - End */

/* Header Menu Changes */

.breadcrumb{
padding: 5px 0 20px
}

.breadcrumb>li {
color: #454545
}

.menu.expanded .catalog li .submenu li a:hover {
color: #0098d4;
text-decoration: none
}

section.search .search-form .form-group input {
height: 42px;

border: 0 solid #c6c6c6;
border-radius: 5px;
background: #e6e6e6 url(https://eu.evocdn.io/dealer/1022/content/media/COSSearchMag.svg)no-repeat left 15px center;
background-size: 22px 22px;
padding: 0 0 0 45px
}

@media only screen and (max-width: 768px){
section.search .search-form .form-group input {
background: none;
padding: 0
} }

.shop-filters section.search .search-form .form-group input {
width: 95%
}

.shop-filters section.search .search-form button[type="submit"] i {
display: none
}
.shop-filters section.search .search-form button[type="submit"]:before {
content: "Go";
text-transform: uppercase;
line-height: 14px
}

.shop-filters section.search .search-form button[type="submit"] {
top: 0;
height: 42px;
width: 42px;
padding: 5px;
background: #008080;
border-radius: 50%;
text-align: center;
right: 0;
font-size: 16px;
color: #fff;
font-weight: 700;
border: 3px solid #ffffff
}

header section.search .search-form .form-group input[type=text] {
color: #111;
border-radius: 5px
}

.fa-balance-scale:before {
content: "\f24e";
color: #111
}

.toolbar .cart-btn>.btn span {
line-height: 22px
}

.toolbar .cart-btn>.btn span.minicart_count {
padding-left: 0;
    padding-right: 0;
    padding-top: 0;
    padding-bottom: 0;
    font-weight: bold;

background-color: #3dbbbb;
width: 22px;
border-radius: 50%;
color: #fff;
text-align: center;
font-size: 14px;
font-weight: 400
}

.btn-material .count {
right: -7px;
top: -7px;
background-color: #3dbbbb
}

 @keyframes colorchange
    {
      0%   {background: #f5f5f5}
      33%  {background: #a7e1fd}
      66%  {background: #f5f5f5}
      100%  {background: #a7e1fd}
      }

    @-webkit-keyframes colorchange /* Safari and Chrome - necessary duplicate */
    {
      0%   {background: #f5f5f5}
      33%  {background: #00ecff}
      66%  {background: #f5f5f5}
      100%  {background: #00ecff}
   }

.modal-content  {
border: 3px solid #008080;
box-shadow: 0 5px 15px rgb(0 0 0 / 50%)
}

.toolbar .cart-btn>.btn .fa-shopping-bag:before  {
display:none
}

header section.search .search-form .form-group input[type=text] {
background: #e6e6e6;
padding: 6px 0 5px 15px;
font-size: 14px;
height: 42px
}

header section.search .search-form .form-group input[type=text]:focus {
    transition: all 1s ease-in;
    top: 0;
    left: 0;
    width: 100%;
    background-color: #3dbbbb3d;
    color: #000
}

header section.search .search-form button[type="submit"] {
width: 34px!Important;
height: 42px!Important;

text-align: center;
right: 0;
font-size: 14px;
color: #fff;
font-weight: 700;
background: #7c8e9a;
border-radius: 0 5px 5px 0;
border-left: 2px solid #ffffff
}

.arrow_box:after, .arrow_box:before {
left: 88%
}

.headersection-2 {
padding-top: 5px;
height: 70px
}

.Googlelink {
color: #fff;
font-weight: 700
}

.header-full .search_container {
flex: 1
}

@media only screen and (min-width: 768px) {
.header-full .logo img {
width: 235px !important;
max-width: 100% !important;
height: auto !important;
max-height: none !important
} }

.header-full section.search {
padding: 0;
border-radius: 5px;
background: #ffffff;
border: 0
}

.header-full .vertical-align>div {
width: auto
}

header .header-full .widgetsearch.search {
margin: 15px 0
}

.menu.expanded .catalog .submenu li.has-image a img {
border: 1px solid #b3b3b3!important;
padding: 10px;
margin-top: 15px;
filter: brightness(0.75)
}

.menu.expanded .catalog .submenu li.has-image a img:hover {
filter: brightness(0.9)
}

.menu.expanded .catalog .submenu li.has-image a {
padding-left: 0
}

.menu .catalog li .submenu {
max-height: 395px
}

.menu.expanded .catalog .submenu li > ul > li:nth-of-type(5) a{
color: #111;
font-weight: 700
}

.menu.expanded .catalog .submenu li > ul > li:nth-of-type(5) a:hover{
color: #0098d4
}
.menu .catalog li:hover {
background-color: #878787
}

.menu.expanded .catalog li .submenu {
border-top: 3px solid #3dbbbb
}

.menu ul.catalog>li.has-submenu>a:hover {
color: #111;
transition: all .35s
}

.menu.expanded .catalog>li>ul.submenu>div>li {
width: 16.667%
}

.menu.expanded .catalog .submenu .submenucontainer>li>a {
text-transform: uppercase;
text-decoration: none;
font-size: 1.00rem
}

.menu.expanded .catalog .submenu li a {
color: #111;
font-size: .9rem;
Padding-bottom:5px
}

.menu ul.catalog>li.has-submenu>a {
text-transform: uppercase;
font-size: .95em;
font-weight: 600
}

.menu .catalog li a {
    padding: 9px 10px
}

.menu .catalog li {
padding: 0
}

/* Header Menu Changes - End */

/* Temp Code for Mini Cart Display*/

.toolbar .cart-btn:hover>.btn{
background: #c9c9c9
}

.toolbar .cart-btn>.btn {
background: #ffffff;
    height: 42px;
    border: 1px solid #b9dada;
    border-radius: 8px
}

.Googlelink .text-small {
font-size: 24px;
letter-spacing: 2px
}

.toolbar .cart-btn>:hover.btn {
background: #eaf7f6;
    border-color: #008080;
    color: #005e5e
}

.toolbar .cart-btn>.btn b {
color: #111;
font-size: 14px;
font-weight: 700;
line-height: 32px
}

.toolbar .cart-btn>.btn span {
color: #fff
}

.toolbar .cart-btn>.btn i {
  display: inline-block;
    width: 20px;
    height: 20px;
    background: url(https://eu.evocdn.io/dealer/1022/content/media/cosbasketicon2.png) no-repeat center;
    margin-right: 5px;
    margin-left: 0;
    max-width: 20px
}

.toolbar .cart-btn>.btn {
    padding: 5px 20px 5px 10px
}

/* Temp Code for Mini Cart Display - End */

.footLinks li a {
    display: block;
    border-bottom: 2px solid transparent;
    transition: all .35s;
    margin-bottom: -2px;
    padding: 8px 0
}

.text-white {
color: #222
}

.CList {
    margin: 0;
    padding: 0;
    list-style: none
}

.CFlex {
    display: flex;
    justify-content: space-between;
    align-items: center;
white-space: nowrap
}

.CList li {
    margin: 0;
    padding: 0
}

.footLinks li {
display: inline-block;
font-size: 14px;
text-transform: capitalize
}

menu ul.catalog > li > a {
    padding: 20px 30px;
    font-weight: 700;
    color: #343434;
    font-size: 16px;
    background: url(https://eu.evocdn.io/dealer/1088/content/media/My_Theme/go-nav-arrow.png) no-repeat right 15px center
}

.footLinks li a:hover {
color: #3dbbbb
}

li.COSLoggedOut.COSSign {
font-weight: 700
}

.menu .catalog-block  {
background-color: #878787!Important
}

.freedelivery_wrapper {
padding: 5px 10px;
color: #fff;
font-size: 18px;
text-align: center;
background: #454545;
margin-bottom: 10px;
margin: 10px 15PX
}

.shopping-cart .freedelivery_wrapper {
margin: 0 0 10px
}

.cart-btn #minicart_points_balance td {
background: #f5f5f5;
color: #2c3949;
font-weight: 700
}

.relationship-carousel .owl-next, .relationship-carousel .owl-prev {
font-size: 1.6em
}

.relationship-carousel .owl-next:before{
content: "\f0da";
color: #333
}

.relationship-carousel .owl-prev:before{
content: "\f0d9";
color: #333
}

.relationship-carousel .owl-prev:hover:before {
color: #3dbbbb
}

.relationship-carousel .owl-next:hover:before{
color: #3dbbbb
}

.singlebanner_wrapper .banner_content .banner_button:hover {
color: white
}

.widget-lastviewedproducts-html .owl-nav .owl-next:before {
content: "\f0da"
}
.widget-lastviewedproducts-html .owl-nav .owl-prev:before {
content: "\f0d9"
}

.catalog-single .product-panel .panel{
box-shadow: none
}

section.search.search-with-in .searchtoolsright a:hover {
    background: #3dbbbb
}

section.search {
background:#ffffff;
border-left: 1px solid #bfe8e8;
border-right: 1px solid #bfe8e8;
border-top: 1px solid #bfe8e8;
box-shadow: 4px 4px 6px 0 rgba(0, 0, 0, .05), -4px -4px 6px 0 hsla(0, 0%, 100%, .3);
border-radius: 0 0 8px 8px
}

section.search.search-with-in .searchtoolsright a {
    color: #292c2e!Important;
    display: inline-block;
    text-transform: capitalize;
    text-align: center;
    font-weight: 700;
    padding: 5px 10px;
    border-radius: 5px;
    border: 1px solid #7e7e7e;
    cursor: pointer;
    white-space: nowrap;
    transition: .2s ease-in;
    font-size: 1.1em;
    background: linear-gradient(to bottom, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%)
}

@media (max-width: 768px){
.TopBanner .banner_title {
max-width: 100%
} }

@media (min-width: 769px){
.TopBanner .banner_title {
max-width: 40%
} }

@media (max-width: 768px){
.TopBanner h3.banner_subtitle {
max-width: 100%
} }

@media (min-width: 769px){
.TopBanner h3.banner_subtitle {
max-width: 50%
} }

.merchandising-content-static .widget-product-box .product-img-container:hover {
box-shadow: 0 10px 10px -5px #cdcdcd
}

.bannerHome .banner_content {
background: linear-gradient(to top, rgba(0, 0, 0, 0) 15%, rgba(0, 0, 0, 0.8))
}

.bannerHome .btn.banner_button{
font-weight: 400;
padding: 5px 15px
}

.bannerHome .bannerHome .doublebanner_wrapper .banner_content, .singlebanner_wrapper .banner_content {
align-items: flex-start;
padding: 20px
}

.bannerHome h3.banner_subtitle {
font-size: 1em!Important
}

.bannerHome .banner_title {
font-size: 1.3em;
color: #fff;
font-weight: 700
}

.merchandising-content-static .widget-product-box .product-price-container {
padding-top: 0;
color: #b12704
}

.merchandising-content-static .widget-box .btn-widget-action  {
background: linear-gradient(to bottom, #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%)
}

.merchandising-content-static .widget-box .btn-widget-action:hover  {
background: #3dbbbb;
color: #fff
}

#merchandisingcontentstatic_185073 .col-lg-3{
float:right
}

#merchandisingcontentstatic_185193 .col-lg-3{
float:right
}

.merchandising-content-static .widget-product-box {
text-align: left
}

.merchandising-content-static .price-from, .merchandising-content-static .price-from+.merchandising-content-static-price {
padding: 5px 0 0 5px
}

.merchandising-content-static .widget-product-box .product-name-container {
padding: 5px 0 0 5px
}

.merchandising-content-static .widget-box .btn-widget-action {
display: inline-block
}

.merchandising-content-static .widget-box {
min-height: 265px
}

.merchandising-content-static .widget-box h3 {
font-size: 1.3em
}

.merchandising-content-static .widget-box p {
font-size: 1em
}

.merchandising-content-static .widget-product-box {
margin-top: 0
}

.merchandising-content-static .widget-product-box .product-img-container {
height: 160px;
mix-blend-mode: multiply;
border: 1px solid #ccc;
margin-bottom: 10px;
background: linear-gradient(180deg, #fefefe 50%, #f3f3f3 100%);
position: relative;
display: flex;
justify-content: center;
align-items: center;
margin: 5px
}

.merchandising-content-static .widget-product-box .product-img-container img {
max-height: 150px;
padding: 0;
mix-blend-mode: multiply
}

.catalog-single .tile .product-name {
font-weight: 400
}

.price-from {
font-weight: 700;
font-size: 14px
}

.shop-filters .filter-section label {
margin: 0;
width: 100%
}

.shop-filters .filter-options label {
width: 100%;
margin: 0;
margin-bottom: 5px
}

.shop-filters .filter-options a {
width: 100%;
display: flex;
font-size: 1em;
align-items: center;
gap: 10px
}

.shop-filters .filter-options a::before {
content: "";
width: 15px;
height: 15px;
border: 1px solid #3dbbbb;
flex-shrink: 0;
border-radius: 2px;
display: none
}

.shop-filters .filter-options a:hover::before, .shop-filters .filter-options a:focus-within::before {
border: 3px solid #3dbbbb
}

.shop-filters .filter-options a.active::before {
background-color: #3dbbbb;
border-color: #3dbbbb;
background-image: url(https://eu.evocdn.io/dealer/1022/content/media/costick24.svg);
background-repeat: no-repeat;
background-size: 9px;
background-position: center
}

.shop-filters .filter-options .filterOptionName {
margin-right: auto
}

.shop-filters .filterOptionCount {
color: #878787;
font-size: .75em
}

.shop-filters .filter-section {
background: white;
border-radius: 8px;
box-shadow: 4px 4px 6px 0 rgba(0, 0, 0, .05), -4px -4px 6px 0 hsla(0, 0%, 100%, .3);
border: 1px solid #bfe8e8;
padding: 10px;
margin: 0
}
#productsrelated_144568 .relationship-carousel .owl-carousel .owl-nav .owl-prev {
background: #ffffff
}

#productsrelated_144568 .relationship-carousel .owl-carousel .owl-nav .owl-next {
background: #ffffff
}

#merchandisingcontent_183411 .inner {
max-width: 94%;
margin-right: 40px
}

body.ex-product .product-options .option-group .option-group-swatch .swatch-preview {
background-size: 170%;
bottom: -75px;
height: 75px;
width: 75px;
left: 3px
}

.product-options .option-group-radiobox input[type=radio] {
vertical-align: text-top
}

.product-options .option-group-radiobox {
display: inline-block;
margin: 0 20px 5px 0
}

body.ex-product .product-options .option-group .option-group-swatch label {
border: 0 solid #949494!Important;
padding: 0;
font-weight: 400;

display: flex;
flex-direction: column;
align-content: stretch;
justify-content: space-evenly;
align-items: center
}

.product-options .option-group {
  order: 2;
  flex: 0 0 calc(50% - 6px)
}

.product-options .option-group[data-type="6"] {
  order: 1;
  flex: 0 0 100%
}

#merchandisingcontent_158521 .catalog-single h3 {
background: #f6cb25!Important;
color: #000!Important
}

.catalog-grid .tile .manufacturer-ref {
font-size: 10px
}

.cart-dropdown .fa-plus-square-o:before {
content: "\f106"!important
}

.extend_del_Banners {
background: #ffffff!important
}

.PrdPricePromoHd {
Background: #e6e6e6!important;
padding: 5px 0!important
}

.cart-dropdown .fa-minus-square-o:before {
content: "\f107"!important
}

.catalog-single .product-brand a {
text-transform: uppercase;
margin-left: 2px
}

.catalog-single .tile img {
mix-blend-mode: multiply
}

.cat-tiles .tile .cat-thumb-container>img {
max-width: 185px;
border-radius: 20px;
max-height: 185px;
mix-blend-mode: multiply
}

.catalog-grid .tile .footer .brand-label a:hover, .catalog-grid .tile .product-name a:hover {
color: #808080!important
}

.cat-tiles .tile .cat-thumb-container {
height: 200px;
display: flex;
justify-content: center;
align-items: center;
background: #f5f5f5;
border-radius: 10px
}

.widget-lastviewedproducts-html.catalog-single h3 {
text-transform: uppercase;
font-weight: 700
}

.catalog-single.has-carousel {
border-bottom: 1px solid #f3f3f3
}

.catalog-single.has-carousel h3 {
padding: 0 15px;
text-align: left!important
}

.cat-tiles a {
margin-bottom: 0
}

.ribbon-wrapper .ribbon-side {
display:none
}

.catalog-single .price {
color: #000;
font-size: 2em;
background: #ffffff!Important;
padding: 0;
margin: 0;
margin-top:30px
}

.price-label.has-price::after, .price > .has-price::after, .price.has-price::after  {
display: inline-flex
}
span.price-label-inc-vat {
font-weight: 700;
font-size: 12px;
margin-right: 5px
}

.fa-wrench:before {
padding: 5px;
color: #454545;
font: normal normal normal 20px/1 FontAwesome
}

.fa-truck:before {
padding: 5px;
color: #454545;
font: normal normal normal 20px/1 FontAwesome
}

.fa-leaf:before {
padding: 5px;
color: #4caf50;
font: normal normal normal 20px/1 FontAwesome
}

.fa-recycle:before {
color: #4caf50!Important;
padding: 5px;
font: normal normal normal 20px/1 FontAwesome
}

.fa-shield:before {
padding: 5px;
color: #454545;
font: normal normal normal 20px/1 FontAwesome
}

#slider-banner-119553 img{
-webkit-mask-image: -webkit-gradient(linear,left top,left bottom,color-stop(100%,#000),color-stop(100%,transparent))
}

.hero-slider .ms-bullet {
border-radius: 20px;
border: 1px solid lightgrey;
width: 10px;
height: 5px;
margin: 0 4px;
transition: all .35s ease;
background: #ffffff
}

.hero-slider .ms-bullet-selected  {
width: 45px
}

.catalog-single .prod-gal button.product-lightbox-open {
right: 0;
bottom: 20px
}

.lastviewedproducts-content .product-list-actions {
right: 15px
}

.product-list-actions {
    position: absolute;
    right: 10px;
    bottom: 10px;
    z-index: 1;
    display: none
}

.catalog-grid .product-list-actions {
top: calc(50% - 10px) !important
}

.cart-dropdown table.minicart tr.gift td .gift-element {
margin-left: -10px;
border-color: #32ccff transparent transparent
}

.cart-dropdown table td.price .content_value {
background: #f5f5f5
}

/* Removing Checkout Button from Mini Cart */
.cart-dropdown .footer .col-xs-6 {
width: 100%
}

.cart-dropdown .footer .btn.btn-outlined-invert.btn-block.to-checkout {
display: none!Important
}

.cart-dropdown .footer .btn.btn-outlined-invert {
color: #fff
}

.cart-dropdown .footer  {
padding: 15px
}

/* Removing Trash from Item Mer in Chgeckout */

div#merchandisingcontent_215442 .footer-wrapper span.product-category {
display: none
}

div#merchandisingcontent_215442 .footer-wrapper .indicators-grid {
display: none
}

div#merchandisingcontent_215442 .product-compare-action {
display: none
}

div#merchandisingcontent_215442 .catalog-single.has-carousel.item-merchandising {
box-shadow: 0 0 0 0 #fff!important
}

div#merchandisingcontent_215442 .catalog-single.has-carousel h3 {
border-bottom: 0;
text-transform: none
}

.group-filters .save-buttons .new-group-btn {
background: #3dbbbb
}

.catalog-grid .tile .footer .btn-primary.pre_order_btn:before {
content: "\f06a";
font: normal normal normal 14px/1 FontAwesome;
margin-right: 10px
}

.catalog-grid .tile .footer .btn-primary.pre_order_btn.MTO_btn:before {
content: "\f044";
font: normal normal normal 14px/1 FontAwesome;
margin-right: 10px
}

.ex-product button#addItemToCart.pre_order_btn.MTO_btn:before {
content: "\f044";
font: normal normal normal 14px/1 FontAwesome;
margin-right: 10px
}

.ex-product button#addItemToCart.pre_order_btn:before {
content: "\f06a";
font: normal normal normal 14px/1 FontAwesome;
margin-right: 10px
}

.col-md-12.icons-block {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
font-size: 11px
}

/* stand Out Navigation Tabs  */
li.standOut > a {
	display: inline-block;/*bug fix*/
	position: relative;
	text-decoration: none;

}

li.standOut > a::after {
	content: 'NEW';
	position: absolute;
        bottom: 99%;
	right:50%;
	background: #3dbbbb;
	padding: 0 6px 0 5px;
	color: #fff;
	white-space: nowrap;
	opacity: 1;
	font-size: 12px;
	font-weight: bold;
  font-family: sans-serif;
	transition: all 200ms ease
}

li.standOut > a::before {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    border-top: 8px solid #5bd2ec;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    transition: all 200ms ease;
    opacity: 1;
    right: 60%;
    bottom: 88%
}

li.standOut > a:hover::after {
	bottom: 89%
}
 li.standOut > a:hover::before {
	bottom: 78%
}
li.standOut > a::after {
animation: fadeinnd 1s
}
li.standOut > a::before {
animation: fadeinnd 1.6s
}

/* stand Out Navigation Tabs - end  */

.COSVAT input.cmn-toggle-round-flat.tiny+label {
    height: 18px;
    width: 50px
}

.COSVAT input.cmn-toggle-round-flat.tiny:checked+label:after  {
margin-left: 20px
}

.COSVAT input.cmn-toggle-round-flat:checked + label:after {
background-color: transparent;
content: "ON";
font-size: 12px;
line-height: 12px;
font-weight: 600
}

.COSVAT input.cmn-toggle-round-flat+label:after {
background-color: transparent;
content: "OFF";
font-size: 12px;
line-height: 12px;
color: #454545;
font-weight: 600
}

.COSVAT input.cmn-toggle-round-flat+label {
border-radius: 5px
}

.COSVAT input.cmn-toggle-round-flat+label:before {
background-color: transparent;
border-radius: 5px;
bottom: 0;
left: 0;
right: 0;
top: 0
}

body .toolbar .account-btn {
  color: #111;
  background: #ffffff;
  border: 1px solid #b9dada;
  padding: 10px 14px;
  cursor: pointer;
  z-index: 101;
  font-size: 14px;
  font-weight: 800;
  border-radius: 6px;
  max-height: 42px;
  min-height: 42px;

  display: inline-flex;
  align-items: center;
  gap: 8px;

  transition: all .18s ease
}

/* HOVER */
body .toolbar .account-btn:hover {
  transform: translateY(-1px);
  background: linear-gradient(180deg, #ffffff 0%, #ededed 100%);
  box-shadow:
    0 3px 8px rgba(0, 0, 0, 0.12),
    0 6px 14px rgba(0, 0, 0, 0.10)
}

/* ACTIVE / CLICK */
body .toolbar .account-btn:active {
  transform: translateY(0);
  box-shadow:
    0 1px 2px rgba(0, 0, 0, 0.10)
}

/* FOCUS (keyboard accessibility) */
body .toolbar .account-btn:focus {
  outline: 2px solid #3dbbbb;
  outline-offset: 2px
}

body.ex-loggedout .toolbar .account-btn:after{
content:"Login"
}
body.ex-loggedin .toolbar .account-btn:before{
content:"My Account"
}
body.ex-loggedin .toolbar .account-btn{
margin-left:5px;
justify-content:center
}

body.ex-loggedout .toolbar .account-btn {
margin-right: 0
}
.headLogoutButton{
display:none
}
.headLogoutButton:before{
  display:none
}

body .toolbar .account-btn:hover{
    background: #eaf7f6;
    border-color: #008080;
    color: #005e5e;
    transform: none
}

body .toolbar .shopping-tools-wrapper .account-btn > span{
display:none
}

body.ex-loggedin .toolbar .account-btn i, .toolbar .shopping-tools-wrapper .account-btn > span {
display:none
}

.toolbar a span {
color: #000
}

a.toggle-vat-incl-wrapper label {
font-size: 12px
}

.minicart_container {
padding-left: 0
}

.COSVAT .toggle-vat-incl-wrapper {
    margin-left: 0
}

a.toggle-vat-incl-wrapper {
    display: flex
}

i.material-icons.user-icon::before {
font-size: 22px;
color: #000
}

.quicklinks div.ctct-form-embed div.ctct-form-defaults {
padding: 0;
background-color: transparent
}

.quicklinks div.ctct-form-embed form.ctct-form-custom input.ctct-form-element {
height: 30px ! Important
}

.quicklinks div.ctct-form-embed form.ctct-form-custom button.ctct-form-button {
width: 50%;
padding: 7px
}

.quicklinks p {
margin-bottom: 10px
}

.quicklinks div.ctct-form-embed form.ctct-form-custom div.ctct-form-field {
margin: 0 0 10px
}

.quicklinks .ctct-form-embed.form_0 .ctct-form-defaults .ctct-gdpr-text, .quicklinks .ctct-form-embed.form_0 .ctct-form-defaults .ctct-gdpr-text .ctct-form-footer-link {
font-size: 8px;
margin-bottom: 10px
}

.quicklinks .ctct-form-embed.form_0 .ctct-form-defaults .ctct-form-text {
font: 20px;
font-size: 11px!important;
width: 60%
}

.quicklinks .ctct-form-button:hover {
background: #3dbbbb!Important;
color: #fff!Important
}

.quicklinks .ctct-form-button {
background: #008080!Important;
color: #fff!Important
}

.ctct-form-button {
    color: #222!Important;
    background: #6fdbff!Important;
    border: none!Important
}
.ctct-form-button:hover {
    background: #3dbbbb!Important;
    color: #fff!Important
}

@media only screen and (max-width: 768px){
section.quicklinks {
text-align: left!Important
}

.footersection-2 .nFlex h4 {
color: #fff
}

.quicklinks p {
color: #fff
}

.ctct-form-embed.form_0 .ctct-form-custom .ctct-form-label, .ctct-form-embed.form_0 .ctct-form-defaults .ctct-gdpr-text, .ctct-form-embed.form_0 .ctct-form-defaults .ctct-gdpr-text .ctct-form-footer-link, .ctct-form-embed.form_0 .ctct-form-defaults .ctct-gdpr-text .ctct-form-footer-privacy-link {
color: #fff!Important
}
}

.row.account-message {
margin-right: 25px;
margin-left: 25px
}

.merchandising-carousel.carousel-210046 .prodToolsWrap {
display: none
}

.merchandising-carousel.carousel-210046 .product-category {
display: none
}

.merchandising-carousel.carousel-210046 .owl-carousel .tile .footer {
padding: 0
}

.merchandising-carousel.carousel-210046 .tile {
background-color: #e6f9ff;
border: 3px solid #e6e6e6 !important
}

.merchandising-carousel.carousel-210046 .tile:hover {
background-color: #e6e6e6;
border: 3px solid #3dbbbb!Important;
opacity: 1!Important
}

.merchandising-carousel.carousel-210046 .footer {
background-color: transparent;
border-top: 0
}

.merchandising-carousel.carousel-210046 h3 {
color: #454545
}

.merchandising-carousel.carousel-210046 .price-label.has-price {
font-size: 2em
}

.catalog-grid .merchandising-carousel.carousel-210046 .tile:hover .imgthumbnail {
opacity: 1
}

div#htmlcontent_197026, div#htmlcontent_230178 {
background: #f1f1f1
}

/* Move reCAPTCHA v3 badge to the left */

 .grecaptcha-badge {
  width: 70px !important;
  overflow: hidden !important;
  transition: all .3s ease !important;
  left: 4px !important
}

.grecaptcha-badge:hover {
  width: 256px !important
}

.list-attribute.min-order {
display: inline-flex;
    align-items: center;
    font-family: "Montserrat", sans-serif;
    text-transform: uppercase;
    width: auto;
    font-style: normal;
    line-height: 1.45;
    background: #f5f5f5;
    color: #454545;
    font-weight: 700;
    padding: 6px 15px;
    border-radius: 5px;
    font-size: 10px;
    border: 1px solid #ececec;
    height: 36px
}

.iconmoq-min-order-quantity:before {
display: none
}

.iconmoq-min-multiple-quantity:before {
display: none
}

/* Account Application Form */

.cosaccountapplicationform h3 {
text-align: center;
font-size: 30px;
margin-bottom: 20px;
margin-top: 0
}

.cossector-form-Title h3 {
font-size: 16px;
text-align: left;
margin-bottom: 15px
}

.cossectormiddle label {
font-weight: 700
}

.cosaccountapplicationform .cossector-form-Title h3 {
font-size: 18px;
text-align: left;
margin-bottom: 15px;
margin-top: 15px
}

.cosaafsection {
box-shadow: rgb(0 0 0 / 29%) 0 1px 4px;
padding: 5px 10px;
margin-bottom: 15px;
border-radius: 5px
}

.COSAAFSectorPageBox {
margin: 12px 0;
width: 96%;
position: relative;
background: #f7f7f9;
transition: .35s background;
overflow: hidden;
border-radius: 15px;
box-shadow: rgba(0, 0, 0, 0.16) 0 1px 4px
}

.COSAAFPage .nFlex {
align-items: stretch;
flex-wrap: wrap
}

section.COSAAFPage {
margin-top: 45px
}

.cosaccountapplicationform textarea#MessageArea {
box-shadow: rgb(0 0 0 / 29%) 0 1px 4px;
border: 0
}

.cosaafsection {
background: url(https://eu.evocdn.io/dealer/1022/content/media/COSAAFBK.png) no-repeat center;
background-size: cover
}

.cosaafsection span {
font-size: 14px;
margin-left: 10px
}

.catalog-single .product-title {
border-bottom: 0 solid #e6e6e6;
padding-bottom: 0
}

/* Changes to customer tools */

#cdash_approver .grid-body>.row>*, #cdash_requester .grid-body>.row>* {
margin-bottom: 5px;
width: 96%
}
.customertools .customertools-container {
background-color: #f5f5f5;
padding: 41px 0;
isolation: isolate
}

.customertools .your-account {
background: none;
margin: 0 35px 20px;
padding: 0;
text-shadow: none;
text-transform: none;
color: #2f3849;
font-size: 1.4rem
}

.customertools .nav-pills li a:hover i, .customertools .nav-pills li a:focus i {
filter: brightness(0) invert(1)
}

.customertools .customertools-container::after {
bottom: 0;
z-index: -1
}

.customertools .nav i {
font-size: 24px;
vertical-align: middle;
margin-right: 15px;
background: linear-gradient(66deg, #4797ce 0%, #454545 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: rgba(0, 0, 0, 0)
}

.myaccount .myaccount-title {
display: none
}

.myaccount .row.account-message {
display: none
}

.dashboard-links .customertools .customertools-container {
padding-left: 0;
padding-right: 0;
margin-top: 10px
}

.dashboard-links .customertools .your-account {
margin: 0 10px 10px
}

.grid-title .tools i {
color: #4797ce
}

div.customertools .nav {
overflow-y: auto
}

div#lastviewedproducts_235763 {
padding: 10px 30px
}

.grid.simple .grid-title h3 {
color: #454545;
font-size: 1.4em
}

.text-muted {
color: #454545 !important
}

.grid-title .cdash-icon i {
color: #4797ce
}

.myaccount table span.content_value {
font-size: 12px
}

#cdash_accountmanagers_list {
overflow: hidden
}

.grid-body.no-border.hidden-panel.expanded {
overflow: hidden ! Important
}

.grid-title .cdash-icon  {
display: none
}

@media (min-width: 1024px) {
.dashboard-sortable .grid.simple .grid-body {
min-height: 250px
} }

li#cdash_address h4.text-muted i.fa {
display: none
}

li#cdash_address .address-lines {
text-transform: uppercase
}
.page-content
/* Changes to Product Page */

.ex-product section.zonetop {
margin-bottom: 0
}

body.ex-product .twocolumnsleft .col-lg-10, body.ex-product .twocolumnsright .col-lg-10 {
background: #ffffff;
width: 74%;
margin-right: 1%;
border-style: solid;
border-color: #bfe8e8;
border-width: 1px;
border-radius: 15px
}

.catalog-single .softgraybackground, .softgraybackground {
background: #ffffff;
border-style: solid;
border-color: #bfe8e8;
border-width: 1px;
border-radius: 10px;
margin-bottom:5px
}

.desktop .productaddtocart_container {
border-style: solid;
border-color: #0000001a;
border-radius: 10px;
border: 0
}

.extend_del_Banners1 img.responsive.deskimg {
border-style: solid;
border: 1px solid #e6e6e6 !important;
border-width: 2px;
border-radius: 10px
}

.catalog-grid .tile {
margin: 10px auto;
max-width: none;
padding: 10px;
background: #ffffff;
border-radius: 18px;
border: 2px solid #bfe8e8
}

.catalog-grid .tile:hover {
box-shadow: rgba(0, 0, 0, 0.15) 1.95px 1.95px 2.6px
}

.listtools .col.col-sm-2.tools-pagination {
width: 33.33%
}

.listtools .col-md-6.col-sm-12.nowrap {
    width: 40%
}

.gridtools {
padding: 0;
font-size: .9474em;
float: none
}

.ex-product .breadcrumb {
padding: 5px 10px 20px 0
}

.catalog-single.has-carousel .tile, .catalog-single.has-grid .tile {
border-style: solid;
border-color: #3dbbbb;
border-width: 1px;
border-right: 1px solid #3dbbbb ! Important;
border-radius: 5px;
padding: 10px
}

body.ex-product .product-options:before {
font-size: 15px;
font-weight: 700;
width: 100%;
padding: 12px 20px;
background: #e5e5e5;
position: absolute;
top: 0;
left: 0
}

.productsummary_container span.icons-together {
display: flex;
align-items: center;
padding: 5px 10px;
border: 1px solid #b2b2b2;
border-radius: 6px;
margin: 2px
}

.productsummary_container span.icons-together span.description {
display: block;
margin-left: 4px;
margin-top: 0
}

.productsummary_container span.icons-together:hover {
background: #e6e6e6;
color: #000
}

.catalog-single.has-carousel .product-compare-action  {
display: none
}
/* Changes to Ribbons */

.ribbon-wrapper .ribbon-tips {
display: none
}

.label-danger {
color: #fff;
background: #ffffff;
font-weight: 900;
font-size: 10px
}

body.has-myaccount-2 .modal .modal-body {
padding: 0
}

form#userformedit {
margin-top: 20px
}

#approver_settings .panel-group .panel, #requester_settings .panel-group .panel {
background: #ffffff;
padding: 5px
}

.myaccount #details #userformedit .file-preview {
background: #ffffff
}

div.customertools .nav li.group-name h4 {
white-space: wrap;
font-size: 16px ! Important;
margin-bottom: 10px ! Important;
text-transform: uppercase;
padding: 4px 0 0
}

div.customertools .nav a {
border-radius: 0;
color: #454545;
padding: 5px 8px;
transition: background .35s ease, color .35s ease, padding .5s ease;
font-weight: 400;
line-height: .8em;
margin-bottom: 5px;
padding-bottom: 5px;
padding-left: 11px;
padding-top: 5px;
border-left: 6px solid;
border-color: #e6e6e6
}

div.customertools .nav a:hover {
background-color: #f8f8f8;
font-weight: 400;
line-height: .8em;
margin-bottom: 5px;
padding-bottom: 5px;
padding-left: 11px;
padding-top: 5px;
border-left: 6px solid;
border-color: #3dbbbb;
color: #111;
text-shadow: -1px 1px 2px #aaa
}

.ex-product button#addItemToCart.pre_order_btn, .catalog-grid .tile .footer .btn-primary.pre_order_btn {
background: #878787;
color: #f5f5f5
}

.catalog-grid .tile .footer div.rrp {
text-transform: unset;
text-decoration: line-through #b602058f;
font-size: 8px
}

.catalog-grid .tile .footer span.stock-qty {
color: #068800;
order: -1;
width: 75px;
background-color: #f5f5f5;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
height: 40px
}

.catalog-grid .list-attribute.product-stock strong.out-stock {
background: none;
padding: 5px;
display: flex;
height: 40px;
align-items: center;
color: #f00
}

.catalog-grid .list-attribute .product-stock {
width: 100%;
border: 1px solid #ececec;
padding: 0
}

.catalog-grid strong.stock-qty {
margin-right: 5px
}

.catalog-grid .out-stock {
font-size: 12px
}

.catalog-grid .footer > small, .catalog-grid .cfa {
font-size: 12px;
width: 100%;
display: block;
text-align: center;
margin: 0
}

.catalog-grid .out-stock .small, small {
font-size: 12px;
margin-left: 5px;
color: #000000 ! Important;
display: contents
}

.catalog-grid strong.stock-qty:before {
content: "";
width: 8px;
height: 8px;
background: #099502;
display: inline-block;
margin-right: 6px
}

@media only screen and (min-width: 769px){
.ex-product .productdetails .list-attribute.product-stock {
position: absolute;
right: 15px;
top: 0;
width: 50%;
border: 1px solid #ececec;
padding: 0
} }

.ex-product .productdetails .list-attribute.product-stock .in-stock {
font-size: 12px;
font-weight: 700;
display: inline-flex;
flex-direction: row-reverse;
width: 100%;
justify-content: space-between;
height: 30px;
align-items: center;
padding-left: 10px;
color: #068800
}

.ex-product .productdetails .list-attribute.product-stock .out-stock {
font-size: 14px;
font-weight: 700;
color: #f00;
display: inline-flex;
text-align: center;
background: #f5f5f5;
border: none;
align-items: center;
height: 30px;
width: 100%;
justify-content: center
}

.ex-product .productdetails .list-attribute.product-stock span.stock-qty {
color: #068800;
order: -1;
width: 50px;
background-color: #f5f5f5;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
font-size: 14px;
height: 30px
}

.catalog-single .product-summary .productdetails .label-focus {
background: #ffffff;
    color: #008080;
    display: inline-flex;
    align-items: center;
    font-family: "Montserrat", sans-serif;
    text-transform: uppercase;
    width: auto;
    font-style: normal;
    line-height: 1.45;
    padding: 4px 15px;
    border-radius: 5px;
    font-size: 12px;
    border: 1px solid #3dbbbb;
    text-align: center;
    height: 36px
}

body.has-myaccount-2 .modal .modal-header .close {
color: #008080;
right: 10px
}

#quote-product-list-modal.newquotemodal .modal-content, #sales-quote-list-modal.newquotemodal .modal-content  {
padding: 30px 45px!important
}

#quote-product-list-modal.newquotemodal .modal-header, #sales-quote-list-modal.newquotemodal .modal-header {
border-bottom: 1px solid var(--evo-border-color, #ffffff)
}

#quote-product-list-modal.newquotemodal #accordion, #sales-quote-list-modal.newquotemodal #accordion {
border-bottom: 0 solid #e0e0e0
}

#quote-product-list-modal.newquotemodal .modal-content #accordion .panel-heading h3, #sales-quote-list-modal.newquotemodal .modal-content #accordion .panel-heading h3 {
padding-bottom: 10px
}

#quote-product-list-modal.newquotemodal #quote-product-list.table-fixed thead tr th, #sales-quote-list-modal.newquotemodal #quote-product-list.table-fixed thead tr th  {
padding-top: 8px
}
#quote-product-list-modal.newquotemodal #accordion:first-of-type, #sales-quote-list-modal.newquotemodal #accordion:first-of-type:before {
content: "Quotation";
font-size: 20px;
line-height: 42px;
font-weight: 700;
text-transform: uppercase;
color: #049af3
}

#quote-product-list-modal.newquotemodal .modal-header .close, #sales-quote-list-modal.newquotemodal .modal-header .close {
top: calc(50% + 20px);
color: #878787;
right: 0
}

.table.product-summary td  {
color: #454545
}

.contractitems span.price-label-inc-vat {
margin-right: 0
}

.erp-order-footer {
color: #454545;
font-weight: 700
}

.myaccount table {
color: #454545
}

.myaccount .table>tbody>tr.active>td,.myaccount .table>tbody>tr.active>th,.myaccount .table>tbody>tr>td.active,.myaccount .table>tbody>tr>th.active,.myaccount .table>tfoot>tr.active>td,.myaccount .table>tfoot>tr.active>th,.myaccount .table>tfoot>tr>td.active,.myaccount .table>tfoot>tr>th.active,.myaccount .table>thead>tr.active>td,.myaccount .table>thead>tr.active>th,.myaccount .table>thead>tr>td.active,.myaccount .table>thead>tr>th.active {
background-color: #3dbbbb}

.myaccount .panel {
box-shadow: rgba(50, 50, 93, 0.25) 0 2px 5px -1px, rgba(0, 0, 0, 0.3) 0 1px 3px -1px
}

.panel-default>.panel-heading {
color: #fff;
background: linear-gradient(58deg, #4797ce 0%, #3dbbbb 20%, #3dbbbb 80%, #4797ce 100%)
}
.myaccount #erpGridVue .no-more-tables thead th i, .myaccount #gridvue .no-more-tables thead th i, .myaccount #gridvue2 .no-more-tables thead th i, .myaccount #gridvueCylinders .no-more-tables thead th i, .myaccount #gridvuemultisearch .no-more-tables thead th i, .myaccount #userordergridvue .no-more-tables thead th i {
color: #fff
}

.myaccount #erpGridVue .no-more-tables thead th, .myaccount #gridvue .no-more-tables thead th, .myaccount #gridvue2 .no-more-tables thead th, .myaccount #gridvueCylinders .no-more-tables thead th, .myaccount #gridvuemultisearch .no-more-tables thead th, .myaccount #userordergridvue .no-more-tables thead th {
color: #fff
}
.cospromoproduct img.responsive.deskimg {
    background: #ffffff none repeat scroll 0 0;
    border: 5px solid #ffffff;
    box-shadow: 1px 1px 2px #949494
}

.shopping-tools-wrapper.st-vat-toggle a.toggle-vat-incl-wrapper input.cmn-toggle-round-flat.tiny+label {
background-color: #e6e6e6
}

input.cmn-toggle-round-flat+label:before   {
border-radius: 5px
}

input.cmn-toggle-round-flat+label:after  {
border-radius: 2px
}

input.cmn-toggle-round-flat+label  {
border-radius: 5px
}

.toolbar .toggle-vat-incl-wrapper {
order: 2;
margin-left: 15px
}

.header-full .vertical-align {
justify-content: space-between;
margin: 0 -25px
}

.catalog-grid .tile .footer .footer-wrapper {
min-height: 0;
padding: 0
}

.catalog-grid .brand-label, .catalog-grid #grid .brand-label {
line-height: 1;
text-transform: uppercase;
margin: 6px 0 0
}

.catalog-grid .tile .product-sku {
background: #f5f5f5;
    color: #454545;
    font-weight: 700;
    padding: 4px 15px;
    border-radius: 5px;
    display: inline-block;
    border: 1px solid #ececec
}

.customertools .close-panel {
top: 5px
}

div.customertools .nav a#logoutButton span {
margin-right: 8px
}

div.customertools .nav a#logoutButton {
border-color: TRANSPARENT;
background: #3dbbbb;
border-radius: 10px;
padding: 10px
}

div.customertools .nav a#logoutButton:hover {
color: #fff
}
div.customertools[data-static=true] .customertools-container {
background: #fff;
padding: 10px;
margin-top: 0;
border-radius: 10px;
border: 1px solid var(--evo-border-color, #eaeaea)
}

.ticker-container {
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  background:#000000;
  padding:10px;
    color:#fff
}

.ticker-wrapper {
  display: inline-block;
  animation: ticker 30s linear infinite
}

.ticker-wrapper:hover {
  animation-play-state: paused
}

.ticker {
  display: inline-block
}

.ticker-text {
  font-weight: bold;
  color: #f2b922
}

.blink {
  animation: blinker 1.5s linear infinite;
  pointer-events: none;
 color: white;
font-weight: 700
}

@keyframes blinker {
  50% {
    opacity: 0
  }
}

.filter-container {
border-radius: 0;
padding-bottom: 20px
}

@keyframes special {
0%,100%{
background-position: 200% 0%
}

50%{
background-position: 0% 200%
}
}

.text-cwhite2  {
white-space: nowrap;
font-weight: 600;
text-transform: uppercase;
color: #3dbbbb;
text-align: center
}

.text-cwhite2 span {
font-size: 14px;
padding: 0;
text-transform: uppercase;
color: #fff;
animation: zoomup 3s linear infinite;
animation-delay: calc(150ms * var(--i))
}

.special {
width: 100%;
position: relative;
display: flex;
justify-content: center;
align-items: center;
border: 2px solid #049af3;
padding: 10px
}

.text-special  {
font-weight: 700;
font-size: 70px;
line-height: 65px;
letter-spacing: 10px;
text-align: center;
text-transform: uppercase;
color: transparent;
-webkit-background-clip: text;
background-clip: text;
background-size: 400%;
animation: special 25s ease infinite;
background-image: linear-gradient(68.7deg, #3dbbbb 13.2%, #049af3 29.8%, #0c6092 48.9%, #049af3 68.2%, #3dbbbb 86.4%)
}

@keyframes zoomup {
  0%,
  100% {
    color: #fff;
    filter: blur(.5px);
    text-shadow: 0 0 10px #ffffff, 0 0 20px #ffffff, 0 0 30px #ffffff,
      0 0 40px #ffffff, 0 0 60px #ffffff, 0 0 80px #ffffff, 0 0 100px #ffffff,
      0 0 120px #ffffff
  }

  5%,
  95% {
    filter: blur(0);
    color: #3dbbbb;
    text-shadow: none
  }
}

@keyframes zoomup1 {
  0%,
  100% {
    color: #fff;
    filter: blur(.5px);
    text-shadow: 0 0 10px #ffffff, 0 0 20px #ffffff, 0 0 30px #ffffff,
      0 0 40px #ffffff, 0 0 60px #ffffff, 0 0 80px #ffffff, 0 0 100px #ffffff,
      0 0 120px #ffffff
  }

  5%,
  95% {
    filter: blur(0);
    color: #3c1944;
    text-shadow: none
  }
}

.catalog-single .product-title {
padding-bottom: 05px;
padding-top: 15px
}

.catalog-single .product-title .product-name {
font-size: .875em;
color: #454545;
font-family: "Montserrat", sans-serif !important;
text-transform: uppercase;
letter-spacing: normal;
line-height: 1.5
}

.catalog-single .product-title + .live-inventory-v2-wrapper {
    color: #008080;
    font-size: 14px;
    font-weight: 700
}

@media only screen and (max-width: 768px){
.catalog-single .product-title .product-name {
font-size: .75em
} }

.panel-group .panel-heading {
padding: 15px;
background-color: #f4f4f4
}

.catalog-single .panel-group .panel-heading h3 {
margin: 0;
font-family: "Montserrat", sans-serif !important;
letter-spacing: normal;
color: #454545;
font-size: 1em;
line-height: 1.5;
display: flex;
justify-content: space-between;
align-items: center
}

.panel-heading.collapsed h3:after  {
font-size: 1.6em
}

.panel-heading h3:after {
font-size: 1.6em
}

.panel-body {
padding: 15px 30px !important;
background: #ffffff
}

.tech-specs .item {
padding: 5px 0
}

.tech-specs .item:not(:last-child) {
border-bottom: 1px solid #e6e6e6
}

.tech-specs .item:nth-child(2n+1) {
background-color: rgba(0, 0, 0, 0)
}

.catalog-single .product-points ul {
padding: 5px 0;
list-style: none
}

.catalog-single .prod-gal {
margin: 0 0 150px !important
}

@media only screen and (max-width: 768px){
.catalog-single .prod-gal {
margin: 0 !important
} }

.catalog-single .ms-thumb-list {
bottom: -120px ! Important;
height: 120px !important
}

.catalog-single .ms-thumb-frame:hover {
border-color: #3dbbbb
}

.catalog-single .ms-thumb-frame {
width: 120px !important;
height: 120px !important;
background-color: #f5f5f5;
border-radius: 5px;
padding: 10px;
opacity: 1;
border: 1px solid #e6e6e6;
margin: 0 10px 0 0 !important
}

.catalog-single .ms-thumb {
mix-blend-mode: multiply;
position: relative;
object-fit: contain;
width: auto;
height: auto;
max-width: 100%;
max-height: 100%;
display: block;
top: inherit;
transform: none
}

.catalog-grid .imgthumbnail {
height: 250px
}

@media (max-width: 700px) {
.catalog-grid .imgthumbnail {
height: 190px
}}

.catalog-grid .imgthumbnail img {
mix-blend-mode: multiply;
max-width: 100%;
max-height: 100%;
width: auto;
height: auto;
transition: transform .2s
}

.catalog-grid .imgthumbnail:hover img  {
transform: scale(1.1)
}

#filterswrapper .swatch-grid {
display: flex;
flex-wrap: wrap;
margin: 0 0 10px;
gap: 5px
}

#filterswrapper .swatch-grid .option-div {
margin: 0;
height: 28px;
width: 28px
}

#filterswrapper .swatch-grid .option-div label {
margin: 0;
display: block;
height: 100%;
width: 100%
}

#filterswrapper .swatch-grid a {
border-radius: 15%;
padding: 0;
height: 100%;
width: 100%;
min-height: 0;
min-width: 0;
display: block;
margin: 0;
border: 1px solid #e6e6e6
}

.shop-filters .swatch-bg-image .selected-btn, .shop-filters .swatch-bg-image a {
background-size: auto
}

/* Quicklink Bar - Category / Search */

.QFlex {
display: flex;
justify-content: space-between;
align-items: center;
white-space: nowrap;
background: white
}

ul.CList.QFlex.Quicklinksa.font-Sans-Pro {
    border-radius: 5px
}

.Quicklinks {
padding-top: 5px;
padding-bottom: 5px
}

.Quicklinks ul li.cosqlink {
width: 1px;
height: 10px;
background: #454545;
margin: 0 2px;
display: none
}

.text-qlwhite {
color: #fff;
white-space: nowrap;
transition: .35s all;
padding: 0 10px
}

.text-qlhwhite {
color: #fff;
white-space: nowrap;
transition: .35s all;
padding: 0 10px
}

.text-qlhwhite:hover {
color: #fff
}

.Quicklinksa li {
display: inline-block;
font-size: 14px;
text-transform: capitalize;
background-color: #454545;
width: 100%;
text-align: center;
padding: 4px 0
}

li.COSQuicklink2 {
background-color: #fff;
border-bottom: 0 #e6e6e6;
border-left: 6px solid #e6e6e6;
border-color: #e6e6e6;
transition: .3s linear;
line-height: .8em;
margin-left: 5px
}

li.COSQuicklink2:hover {
border-color: #3cf
}

.text-qlwhite {
color: #454545
}

.text-qlhwhite:hover {
color: #3dbbbb
}

.text-qlwhite:hover {
color: #000;
text-shadow: #aaa -1px 1px 2px
}

li.COSQuicklink1 {
border-radius: 5px 0 0 5px
}

.shop-filters .remove-filter .remove-text {
color: #454545;
font-size: 1em;
padding-right: 3px;
visibility: hidden;
margin-left: 10px;
float: none
}

.shop-filters .remove-filter {
color: #454545
}

#menulinks_262574 section.quicklinks ul, #menulinks_264826 section.quicklinks ul,
#menulinks_265457 section.quicklinks ul, #menulinks_269008 section.quicklinks ul,
#menulinks_269869 section.quicklinks ul, #menulinks_269858 section.quicklinks ul,
#menulinks_274121 section.quicklinks ul, #menulinks_277017 section.quicklinks ul,
#menulinks_277356 section.quicklinks ul, #menulinks_277356 section.quicklinks ul,
#menulinks_277363 section.quicklinks ul, #menulinks_277377 section.quicklinks ul
{
padding: 0
}

#menulinks_262574.menulinks_container section.quicklinks li.Quicklinka a:hover, #menulinks_264826.menulinks_container section.quicklinks li.Quicklinka a:hover,
#menulinks_265457.menulinks_container section.quicklinks li.Quicklinka a:hover, #menulinks_269008.menulinks_container section.quicklinks li.Quicklinka a:hover,
#menulinks_269869.menulinks_container section.quicklinks li.Quicklinka a:hover, #menulinks_269858.menulinks_container section.quicklinks li.Quicklinka a:hover,
#menulinks_274121.menulinks_container section.quicklinks li.Quicklinka a:hover, #menulinks_277017.menulinks_container section.quicklinks li.Quicklinka a:hover,
#menulinks_277363.menulinks_container section.quicklinks li.Quicklinka a:hover, #menulinks_277377.menulinks_container section.quicklinks li.Quicklinka a:hover,
#menulinks_277356.menulinks_container section.quicklinks li.Quicklinka a:hover
{
color: #ef4900;
text-shadow: none
}

body.ex-loggedout #menulinks_262574.menulinks_container section.quicklinks li.Quicklinkb, body.ex-loggedout #menulinks_264826.menulinks_container section.quicklinks li.Quicklinkb,
body.ex-loggedout #menulinks_265457.menulinks_container section.quicklinks li.Quicklinkb, body.ex-loggedout #menulinks_269008.menulinks_container section.quicklinks li.Quicklinkb,
body.ex-loggedout #menulinks_269869.menulinks_container section.quicklinks li.Quicklinkb, body.ex-loggedout #menulinks_269858.menulinks_container section.quicklinks li.Quicklinkb,
body.ex-loggedout #menulinks_274121.menulinks_container section.quicklinks li.Quicklinkb, body.ex-loggedout #menulinks_277017.menulinks_container section.quicklinks li.Quicklinkb,
body.ex-loggedout #menulinks_277356.menulinks_container section.quicklinks li.Quicklinkb, body.ex-loggedout #menulinks_277363.menulinks_container section.quicklinks li.Quicklinkb,
body.ex-loggedout #menulinks_277377.menulinks_container section.quicklinks li.Quicklinkb,
{
display: none
}

div#productsgrid_269856 {
display:none
}

div#productsgrid_287965 {
display:none
}

div#htmlcontent_269905 {
padding: 20px
}

div#htmlcontent_269905 h4 {
color: #bc9c22;
font-size: 18px
}

.IMGCondition {
padding: 10px
}

.BasketFree {
border: solid 2px #b1b2b3;
padding:4px
}

/*Brand Move to Main Image*/

.catalog-single .main-image .product-brand {
position: absolute;
top: 14px;
right: 14px;
margin: 0
}

.catalog-single .main-image .product-brand a {
min-width: 45px;
height: 45px;
max-width: 120px;
border: 1px solid #b2b2b2;
padding: 5px;
background-color: #f5f5f5;
display: flex;
justify-content: center;
align-items: center;
border-radius: 5px
}

.catalog-single .product-brand a {
color: #000;
font-size: .7em;
font-weight: 700
}

.catalog-single .main-image .product-brand a img {
    max-width: 60px;
    mix-blend-mode: multiply;
    max-height: 40px
}

.catalog-single .main-image .product-brand a:hover, .catalog-single .main-image .product-brand a:focus {
border-color: #3dbbbb
}

@media only screen and (min-width: 2401px) {
#bgvid {
bottom: 50%
} }

@media only screen and (max-width: 2400px) and (min-width: 1501px),
       only screen and (max-width: 1500px) and (min-width: 1220px) {
#bgvid {
bottom: 0%
} }

.coverarealeitz {
max-width: 1085px;
margin-left: 50px
}

.coverarealeitz video {
width: 1480px
}

.shopping-cart .product-category {
display: none
}

.shopping-cart .catalog-grid .tile .footer, .catalog-single .tile .footer {
background: inherit;
position: relative
}

.shopping-cart .owl-carousel .tile .footer .price-label {
font-size: 20px;
color: #454545
}

.gridtools button {
background: #3dbbbb
}

.gridtools button:hover {
background: #008080
}

.load-more-btn-wrapper button.load-more-btn.btn.btn-sm  {
background: #008080
}

.load-more-btn-wrapper button.load-more-btn.btn.btn-sm:hover {
background: #3dbbbb
}

button.btn.btn-default.btn-sm.btn-media-full.clear-cart {
background: #b2b2b2
}

button.btn.btn-default.btn-sm.btn-media-full.clear-cart:hover {
background: #878787
}

.shopping-cart .cart-sidebar .cart-totals .btn {
width: 100%
}

.catalog-grid .tile .footer-wrapper-price span {
display: flex;
    color: #454545;
    font-size: 12px;
    ORDER: -1;
    align-items: center
}

.catalog-grid .tile .footer span.has-vat-price {
font-size: 16px
}

.catalog-grid .tile .footer span.in-stock:before {
    content: "✓";
    color: #008080;
    font-weight: bold;
    margin-right: 5px
}

.catalog-grid .tile .footer-wrapper-price .uomvalue {
font-size: 14px;
font-weight: 700;
margin-top: 0
}

.catalog-grid .tile .footer span.uom.uomblock, .catalog-single .tile .footer span.uom.uomblock, .uom.uomblock {
display: block;
margin-bottom: 10px;
margin-top: 0
}

.catalog-grid .product .tile .price-from {
display: block;
width: 100%;
margin: 0 0 10
}

.catalog-grid .footer-wrapper-description {
display: inline
}

.catalog-single .product-shopping-actions-options-wrapper {
    position: relative;
    margin: 0;
  margin-top: 10px;
    margin-bottom: 10px
}

.catalog-single .product-shopping-actions-options {
position: static;
    padding: 10px 10px 0;
    border: 1px solid #e5e5e5;
    background: #f5f5f5
}

@media only screen and (max-width: 1024px){
body.ex-product .badges-wrapper {
display: none
} }

.catalog-grid .list-attribute.product-stock {
width: 100%;
border: 1px solid #ececec;
padding: 0
}

.merchandising-carousel.carousel-215452 .label-danger, .merchandising-carousel.carousel-276441 .label-danger  {
display: none
}

.merchandising-carousel.carousel-215452 .tile, .merchandising-carousel.carousel-276441 .tile {
border: 1px solid #3dbbbb;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
margin: 10px
}

.merchandising-carousel.carousel-215452 .rrp, .merchandising-carousel.carousel-276441 .rrp {
display: none
}

.live-inventory-v2-add-to-cart-wrapper {
max-width: 80%;
align-items: center;
width: 100%
}

@media only screen and (max-width: 768px){
.live-inventory-v2-add-to-cart-wrapper {
margin-bottom: 10px
} }

.catalog-grid .tile .footer span.in-stock {
  width: auto
}

.softgraybackground .buttons.group {
  display: flex;
  flex-direction: column;
  align-items: center
}

/* New Inventory Style */

.catalog-grid .tile .footer span.in-stock {
color: #008080;
font-size: 13px;
font-weight: 700;
display: flex;
height: 40px;
justify-content: center;
margin-top: 5px;
align-items: center;
background: #3dbbbb3d;
width: 100%;
border-radius: 6px
}

@media (max-width: 700px) {
.catalog-grid .tile .footer span.in-stock {
        height: 32px;
        min-height: 32px;
        font-size: 12px
}}

.catalog-grid .tile .footer span.out-stock {
font-size: 12px ! Important;
    font-weight: 700;
    display: flex;
    height: 40px;
    justify-content: center;
    margin-top: 5px;
    align-items: center;
    border-radius: 6px;
    color: #b91c1c ! Important;
    background: #fee2e2 ! Important;
    border: 1px solid #b91c1c ! Important
}

@media (max-width: 700px) {
.catalog-grid .tile .footer span.out-stock {
        height: 32px;
        min-height: 32px;
        font-size: 12px
}}

.catalog-single .product-summary .productdetails .out-stock, .catalog-single .product-summary .productdetails .in-stock {
display: flex;
height: 36px;
justify-content: space-evenly;
border: 2px solid #e6e6e6;
margin-top: 5px;
color: #068800;
font-size: 16px;
align-items: center
}

.catalog-single .product-summary .productdetails .in-stock {
background: #f3fff3
}

.catalog-single .product-summary .productdetails .out-stock {
background: #fff3f3;
font-size: 14px;
color: #ff0000 ! Important;
border: 1px solid #ff0000
}

/* New Inventory Style - end*/
.hearbg {
background: #ffffff none repeat scroll 0 0;
border: 5px solid #ffffff;
box-shadow: 1px 1px 2px #949494;
border-radius: 10px;
padding: 5px
}

/* Product Page Promotion */
.hearbg img {
border-radius: 10px
}
/* Product Page Spec Links */
.pdpBelowTitle {
display: flex;
align-items: center;
justify-content: space-between;
padding: 5px 15px
}
@media only screen and (max-width: 1024px){
.pdpBelowTitle {
display: none
} }

/* ==========================================
   PRODUCT PAGE - INFORMATION LINKS
========================================== */

.ex-product .productsummary_container .prodInfoLinks {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;

    padding: 10px 0;
    margin: 0;

    border-top: 1px solid #0000001a;
    border-bottom: 1px solid #0000001a;

    font-size: 0.85em;
    color: #231f20;
    font-weight: 400;
    width: 100%;
}

/* Links To label */
.ex-product .productsummary_container .prodInfoLinks::before {
    content: "Links To:";
    color: #898989;
    font-weight: 500;
}

/* Individual links */
.ex-product .productsummary_container .prodInfoLinks a {
    color: #008080;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s ease;
}

/* Hover effect */
.ex-product .productsummary_container .prodInfoLinks a:hover {
    color: #3dbbbb;
    text-decoration: underline;
}

/* Separators between links */
.ex-product .productsummary_container .prodInfoLinks span {
    display: inline-block;
    width: 1px;
    height: 14px;
    background: #d5dddd;
    flex-shrink: 0;
}

/* Live chat icon */
.ex-product .productsummary_container .prodInfoLinks .fa-comments {
    margin-right: 5px;
    font-size: 0.95em;
}

/* Mobile adjustments */
@media (max-width: 767px) {
    .ex-product .productsummary_container .prodInfoLinks {
        gap: 8px;
        font-size: 0.82em;
    }
}
.shop-filters .filter-section:last-child {
box-shadow: 4px 4px 6px 0 rgba(0, 0, 0, .05), -4px -4px 6px 0 hsla(0, 0%, 100%, .3);
border: 1px solid #cccccc
}

.shop-filters section.filter-section {
margin-top: 5px
}

.badgescart-wrapper {
display:none
}

.ProductMainBnr {
border: 1px solid #049af3;
background: url(https://eu.evocdn.io/dealer/1022/content/media/Product-Banner_1_26_2.png) no-repeat center;
background-size: cover
}

div#productsrelated_297120 .owl-next, div#productsrelated_297120 .owl-prev {
top: -28px;
padding: 0;
display: flex;
align-items: center
}

.catalog-single.has-carousel h3 {
padding: 15px 15px 10px;
    text-align: left !important;
    color: #454545;
    background: #f4f4f4;
    border: 1px solid #e6e6e6;
    box-shadow: none;
    border-radius: 3px;
    margin-left: 10px;
    margin-right: 10px
}

@media only screen and (max-width: 768px){
.catalog-single.has-carousel h3 {
margin-left: 0;
margin-right: 0;
padding: 15px;
font-size: 1em
} }

div#productsrelated_297120 .list-attribute.product-category {
display: none
}

div#productsrelated_297120 .label-danger {
position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
    font-size: 14px;
    border-radius: 0 10px 0 30px;
    font-weight: 700;
    text-transform: none;
    color: #fff;
    height: 50px;
    padding: 10px 0 0 5px;
    width: 50px;
background: #3dbbbb
}

#mc_embed_signup .catalog-single .tile .footer .button, #mc_embed_signup .merchandising-content-static .button, .catalog-grid .tile .footer .btn-primary, .catalog-single .tile .footer #mc_embed_signup .button, .catalog-single .tile .footer .btn, .catalog-single .tile .footer .ctct-form-button, .merchandising-content-static #mc_embed_signup .button, .merchandising-content-static .btn, .merchandising-content-static .ctct-form-button {
font-size: 1.1rem
}

.catalog-single .tile .footer span.has-vat-price {
margin-right: 3px
}

.catalog-single .tile .footer span.price-label-inc-vat {
margin-right: 10px
}

.catalog-single .tile .footer span {
font-size: 11px;
line-height: 15px;
color: #121212;
display: inline-flex;
order: -1
}

.owl-carousel .tile .footer .btn {
 width: 75%
}

.owl-carousel .tile .footer span.live-inventory-v2-shipping {
  padding: 5px;
  margin-top: 5px
}

.catalog-single .tile .footer span.in-stock {
color: #008080;
font-size: 12px
}

.catalog-single .tile .footer span.out-stock {
color: #f00;
font-size: 12px
}

/* =========================================
   Premium One-Line Tier Pricing Strip
========================================= */

.tierBoxes.nFlex {
display: flex;
    flex-wrap: nowrap;
    align-items: stretch;
    width: 100%;
    margin: 0 auto;
    padding-top: 25px;
    padding-bottom: 10px;
    background: #ffffff;
    border-radius: 0;
    overflow-x: auto;
    overflow-y: visible;
    justify-content: space-evenly;
}

.ex-product .tierBoxes.nFlex {
    width: 80%
}

/* Hide ugly scrollbar but keep functionality */
.tierBoxes.nFlex::-webkit-scrollbar {
    height: 6px
}
.tierBoxes.nFlex::-webkit-scrollbar-thumb {
    background: #dddddd;
    border-radius: 10px
}

/* =========================================
   Individual Tier Box
========================================= */

.tierBox {
    flex: 0 0 auto;                 /* Prevent shrinking */
   padding: 5px 8px;
    text-align: center;
    position: relative;
    transition: all .25s ease;
  border: 1px solid #e6e6e6;
  display: flex;
    flex-direction: column;
    justify-content: center;
  border-radius: 10px;
  min-width: 80px;
  background: #ffffff
}

/* =========================================
   Header Column
========================================= */

.tierBox.headerRow {
    background: linear-gradient(to bottom, #f8f8f8, #eeeeee)
}

.tierBox.headerRow span {
    font-weight: 700;
    font-size: 12px;
    letter-spacing: .5px;
    color: #444
}

/* =========================================
   Quantity & Price Styling
========================================= */

.tierQty {
    font-size: 13px;
    font-weight: 600;
    color: #666;
    margin-bottom: 2px
}

.tierPrice {
    font-size: 14px;
    font-weight: 800;
    color: #3dbbbb
}

/* =========================================
   Hover Effect
========================================= */

.tierBox:not(.headerRow):hover {
    background: #fafafa;
    transform: translateY(-3px)
}

/* =========================================
   Best Value Highlight (Auto Detected)
========================================= */

.tierBox.bestValue {
    box-shadow: inset 0 0 0 2px #3dbbbb;
    z-index: 3;

    animation: bestValueReveal .6s ease-out forwards
}

/* Slightly darker premium price */
.tierBox.bestValue .tierPrice {
    color: #008080
}

/* =========================================
   Entry Animation
========================================= */

@keyframes bestValueReveal {
    0% {
        transform: scale(0.92);
        opacity: 0
    }
    60% {
        transform: scale(1.05);
        opacity: 1
    }
    100% {
        transform: scale(1)
    }
}

/* =========================================
   Responsive Behaviour
========================================= */

@media (max-width: 768px) {
    .tierBox {
        min-width: 110px;
        padding: 14px 16px
    }
}

@media (max-width: 480px) {
    .tierBox {
        min-width: 100px;
        padding: 12px 14px
    }
}

.col-md-12.product-shopping-actions-tierpricing.products-add-to-cart .tierBox {
    min-width: 90px
}
.tierBoxes.nFlex::-webkit-scrollbar {
    display: none;                /* Chrome, Safari, Opera hide scrollbar */
}

.owl-carousel.owl-loaded .product-shopping-actions-tierpricing.product-tile {
    display: none
}

/* =========================
   Bottom Bar Modern Style – Corporate
========================= */

.topmenu {
    padding: 0;
    background: 000000; /* modern dark */
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important
}

/* Flex layout with horizontal gap */
.topmenu ul.CFlex {
    display: flex;
    justify-content: space-evenly;   /* center links */
    align-items: center;
    flex-wrap: wrap;           /* mobile friendly */
    gap: 14px;                 /* horizontal spacing between links */
}

/* Standard links */
.text-cwhite {
    position: relative;
    color: #eaeaea;
    white-space: nowrap;
    font-size: 15px;
    letter-spacing: .3px;
    border: none;
    transition: color .25s ease-in-out
}

/* Smooth rounded underline */
.text-cwhite::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 0%;
    height: 2px;
    background: #3dbbbb;      /* blue underline */
    border-radius: 2px;        /* rounded ends */
    transform-origin: left center;
    transition: width .35s ease-in-out, background .25s ease-in-out
}

.text-cwhite:hover {
    color: #fff
}

.text-cwhite:hover::after {
    width: 100%
}

/* Remove old divider styling */
.topmenu ul li.cosDivide3 {
    display: none
}

/* =========================
   SPECIAL OFFERS Upgrade (Orange Glow)
========================= */

.text-cwhite2 span {
    font-size: 17px;
    text-transform: uppercase;
    font-weight: 600;
    color: #3dbbbb;  /* orange color */
    animation: pulseGlow 3s ease-in-out infinite;
    animation-delay: calc(120ms * var(--i))
}

/* Subtle orange pulsing glow */
@keyframes pulseGlow {
    0%,100% {
        color: #3dbbbb;
        text-shadow: 0 0 6px rgba(255,136,0,0.6)
    }
    50% {
        color: #fff;
        text-shadow: 0 0 12px rgba(255,136,0,0.9)
    }
}

/* =========================
   Responsive
========================= */

@media (max-width: 768px) {
    .topmenu ul.CFlex {
        gap: 12px
    }

    .text-cwhite, .text-cwhite2 span {
        font-size: 15px;
        padding: 5px 0;  /* maintain vertical padding on mobile */
    }
}

/* Wrapper styling */
.delivery-info-wrapper {
padding: 00px 15px;
padding-bottom: 10px
}
@media only screen and (max-width: 768px){
.delivery-info-wrapper {
border: 1px solid #e6e6e6 !important;
background: #ffffff;
border-radius: 10px
} }

div#htmlcontent_189501 {
background: #ffffff;
border-radius: 0  10px 10px
}

/* Free Delivery label */
.free-delivery-label {
font-weight: 700;
    text-transform: uppercase;
    color: #008080;
    padding: 2px 15px;
    border-radius: 4px;
    font-size: 1.6rem;
    text-align: center;
    width: fit-content;
    margin: 0 auto
}

/* Delivery info row */
.delivery-info {
    display: flex;
    align-items: center;
    justify-content: space-between
}

/* Truck icon */
.truck-icon {
    font-size: 26px;
    color: #2e7d32;
    margin-right: 10px
}

/* Lead time text */
.delivery-info p {
    margin: 0;
    font-weight: 700;
    font-size: .9rem;
    text-transform: uppercase;
    flex-grow: 1
}

/* Lead time span inside paragraph */
.delivery-info .skulead {
font-size: 1.2rem;
    text-transform: none;
    font-weight: 700;
    color: #2c3949
}

.stock-note {
color: #121212;
font-size:1rem;
text-align: center;
font-style: italic
}

/* Question mark icon */
.question-icon {
    font-size: 18px;
    color: #4797ce
}

/* Float utility */
.pull-right {
    float: right !important
}

.made-to-order-label {
font-weight: 600;
text-transform: uppercase;
color: #049acf;
font-size: 1rem;
text-align: center
}

button#addItemToCart .fa-shopping-bag:before {
    display: none
}

/* Block Tier Pricing for Account Via Label */
.ex-l-4994 .tierBoxes.nFlex {
display: none
}

.ex-l-5065 .tierBoxes.nFlex {
    display: none
}

/* Optional: Badge pointer and highlight (inside box) */

.catalog-single .product-shopping-actions .product-shopping-actions-addtocart .live-inventory-v2-wrapper {
min-width: 80%
}

.desktop .productaddtocart_container span.live-inventory-v2-shipping.in-stock {
color: #008080;
    font-size: 14px;
    font-weight: 700;
    display: flex;
    height: 40px;
    justify-content: center;
    margin-top: 10px;
    align-items: center;
    background: #ffffff;
    width: 100%;
    border-radius: 6px;
  border: 1px solid #008080
}

.desktop .productaddtocart_container span.live-inventory-v2-shipping.out-stock {
font-size: 12px ! Important;
    font-weight: 700;
    display: flex;
    height: 40px;
    justify-content: center;
    margin-top: 5px;
    align-items: center;
    border-radius: 6px;
    text-align: center;
    color: #b91c1c ! Important;
    background: #fee2e2 ! Important;
    border: 1px solid #b91c1c ! Important
}

.desktop .productaddtocart_container span.live-inventory-v2-shipping.in-stock:before,
.desktop .productaddtocart_container span.live-inventory-v2-shipping.in-stock.low-stock-medium:before,
.desktop .productaddtocart_container span.live-inventory-v2-shipping.in-stock.low-stock-high:before,
.desktop .productaddtocart_container span.live-inventory-v2-shipping.in-stock.low-stock-critical:before
{
content: "✓";
color: #008080;
font-weight: bold;
margin-right: 5px
}

span.live-inventory-v2-shipping.in-stock.low-stock-medium {
color: #b7791f ! Important;
    background: #fff8e1 ! Important;
  border: 1px solid #b7791f ! Important
}

span.live-inventory-v2-shipping.in-stock.low-stock-medium:before {
    color: #b7791f!Important;     /* Orange */
}

span.live-inventory-v2-shipping.in-stock.low-stock-high {
color: #c05621 ! Important;
    background: #fff3e0 ! Important;
    border: 1px solid #c05621 ! Important
}

span.live-inventory-v2-shipping.in-stock.low-stock-high:before {
color: #c05621!Important;        /* Burnt orange */
}

span.live-inventory-v2-shipping.in-stock.low-stock-critical {
color: #b91c1c ! Important;
    background: #fee2e2 ! Important;
      border: 1px solid #b91c1c ! Important
}

span.live-inventory-v2-shipping.in-stock.low-stock-critical:before {
  color: #b91c1c!Important;        /* Deep red */

}

/* Product Indicators */

@media only screen and (max-width: 768px){
.catalog-single .product-summary .productdetails .margindiv {
margin: 5px
} }

.catalog-single .product-item-spacing {
padding-bottom: 0
}

.product-indicators {
    display: flex;
    flex-wrap: nowrap;
    gap: 10px
}

@media only screen and (max-width: 768px){
.catalog-single .product-summary .productdetails {
display: block
} }

.product-indicators i {
display: inline-flex;
    align-items: center;
    font-family: "Montserrat", sans-serif;
    text-transform: uppercase;
    width: auto;
    height: 36px;
    font-style: normal;
    line-height: 1.45;
    background: #f5f5f5;
    color: #454545;
    font-weight: 700;
    padding: 6px 15px;
    border-radius: 5px;
    font-size: 10px;
    border: 1px solid #ececec
}

.product-indicators i i {
    display: none
}

.product-indicators i::before {
    content: "";
    width: 16px;
    height: 16px;
    background-image: url("https://eu.evocdn.io/dealer/1022/content/media/cos-product-icon-star.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    margin-right: 10px;
    display:none
}
.list-attribute.min-order strong {
font-size: 16px;
margin-left: 5px
}

.catalog-grid .tile .list-attribute.min-order strong {
font-size: 10px;
margin-left: 5px
}

.catalog-single .product-summary .productdetails .iconmoq-min-multiple-quantity:before {
display:none
}
@media only screen and (max-width: 1024px){
.product-indicators i::before {
display: none
} }

.product-indicators i::after {
    content: attr(data-original-title)
}

.product-indicators i.fa-leaf::before {
    background-image: url("https://eu.evocdn.io/dealer/1022/content/media/cos-product-icon-eco.svg")
}

.product-indicators i.fa-recycle::before {
    background-image: url("https://eu.evocdn.io/dealer/1022/content/media/cos-product-icon-recycle.svg")
}

.product-indicators i.non-returnable::before {
    background-image: url("https://eu.evocdn.io/dealer/1022/content/media/cos-product-icon-no-return.svg")
}

.product-indicators i.fa-truck::before {
    background-image: url("https://eu.evocdn.io/dealer/1022/content/media/cos-product-icon-truck.svg")
}

.product-indicators i.fa-money-non-taxable::before {
    background-image: url("https://eu.evocdn.io/dealer/1022/content/media/cos-product-icon-no-vat-1.svg")
}

.product-indicators i.fa-wrench::before {
    background-image: url("https://eu.evocdn.io/dealer/1022/content/media/cos-product-icon-wrench.svg")
}

.product-indicators i.fa-leaf, .product-indicators i.fa-recycle, .product-indicators i.fa-wrench {
display:none
}
/* Grid View Pack Size Copy */
.catalog-grid .tile .imgthumbnail .uom-number {
  font-size: 18px;
  font-weight: bold;
  line-height: 1.2
}
.catalog-grid .tile .imgthumbnail .copied-uom {
position: absolute;
bottom: 5px;
right: 5px;
z-index: 10;
background: rgb(230 230 230);
color: #454545;
padding: 6px;
border-radius: 4px;
text-align: center
}
.catalog-grid .tile .imgthumbnail .uom-label {
font-size: 12px;
line-height: 1
}
.catalog-grid .tile .footer span.uom.uomblock {
display: none
}

@media screen and (min-width: 1200px) {
div.griditems div:nth-child(4n) .tile {
border: 2px solid #bfe8e8;
}
}


.ex-product .imageslider_wrapper {
margin-bottom: 3px;
margin-top: 3px
}

/* Top Bar */
.topBar, .headersection-1 {
background: #f5f5f5;
height: 36px
}

.topBar ul li:first-of-type {
padding-left: 0
}

.topBar ul li:not(:last-of-type) {
border-right: 1px solid #6b6b6b
}

.topBar ul {
margin: 0;
padding: 6px 0
}

.topBar ul li {
margin: 0;
padding: 0 20px;
line-height: 13px;
font-size: 14px;
display: inline-block
}

.topBar ul li a {
transition: .25s color;
color: #111
}

.topBar ul li a:hover {
color: #008080
}

.toolbar .cart-btn > .btn b:before {
    content: "Total: ";
    color: #000;
    font-weight: 400
}

/* ==========================================
   COUNTY OFFICE SUPPLIES
   STICKY HEADER
========================================== */

/* Normal header */
@media (min-width: 1200px) {

    .headersection-2 {
        padding-top: 5px;
        height: 70px;
    }

}

/* Sticky header - desktop */
@media (min-width: 1025px) and (min-height: 768px) {

    /* Main header */
    .headersection-2.menubarStick {
        position: fixed !important;
        top: 0;
        left: 0;
        width: 100%;
        height: 70px;
        box-sizing: border-box;
        z-index: 1002;
        background: #ffffff;
    }

    .headersection-2.menubarStick > .row-2 {
        max-width: 1450px;
        margin: 0 auto;
    }

    /* Navigation / benefits section */
    .headersection-5.menubarStick {
        position: fixed !important;
        top: 70px;
        left: 0;
        width: 100%;
        height: 40px;
        box-sizing: border-box;
        z-index: 1001;
        background: #e6f7f7;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.08);
    }

    /* Compensate for fixed header */
    .menubarHeader {
        padding-top: 110px;
    }

}

/* Normal navigation section */
.container-fluid.headersection-5 {
    background: #ffffff;
    height: 40px;
}

/* ==========================================
   COUNTY OFFICE SUPPLIES
   SMOOTH STICKY HEADER ANIMATION
========================================== */

@media only screen and (min-height: 768px) {

    /* Main header - logo and search */
    .headersection-2.menubarStick {
        animation: cosStickySlideDown 0.3s ease-out both;
    }

    /* Navigation bar */
    .headersection-5.menubarStick {
        animation: cosStickySlideDown 0.3s ease-out both;
    }

    /* Smooth slide-in */
    @keyframes cosStickySlideDown {

        from {
            transform: translateY(-110px);
            opacity: 0;
        }

        to {
            transform: translateY(0);
            opacity: 1;
        }

    }

}

/* Respect reduced-motion preferences */
@media (prefers-reduced-motion: reduce) {

    .headersection-2.menubarStick,
    .headersection-5.menubarStick {
        animation: none;
    }

}

.simple-promo {
  display: none;              /* hidden by default */
  opacity: 0;
  transform: translateY(15px);
  transition: opacity .4s ease, transform .4s ease
}

.simple-promo.active {
  display: flex;
  flex-direction: row
}

/* Trigger animation AFTER display is set */
.simple-promo.visible {
  opacity: 1;
  transform: translateY(0)
}

/* Installation Message */
.installation-message {
    padding: 10px 0;
    color: #434343;
    font-size: 13px;
    text-align: center;
    width: 100%;
    white-space: normal;
    word-wrap: break-word;
    line-height: 1.3;
    margin-left: auto;
    margin-right: auto;
    margin-top: 2px;
    background: #ffffff;
font-weight:600
}
.installation-message .fa-wrench:before {
font: normal normal normal 15px / 1 FontAwesome;
padding: 5px;
color: #434343
}

.installation-message a {
text-decoration: underline;
cursor: pointer;
color: #049acf
}

.proforma-message {
margin-bottom: 2px;
    padding: 4px 0;
    color: #000;
    font-size: 14px;
    text-align: center;
    width: 100%;
    white-space: normal;
    word-wrap: break-word;
    line-height: 1.3;
    margin-left: auto;
    margin-right: auto;
  max-width: 70%
}
/* Product Page Pricing Edits */
.catalog-single .product-shopping-actions {
padding: 0
}

.menu-panel ul li {
margin-bottom: 1px
}

.menu-panel.active h3 {
    padding: 0 16px;
    margin: 12px 0;
    font-size: 16px;
    font-weight: 600;
    color: #263238;
    text-transform: none
}

/* ==========================================
   COUNTY OFFICE SUPPLIES
   MODERN SLIDE-OUT CATEGORY MENU
========================================== */

/* OVERLAY */
#menuOverlay {
  position: fixed;
  inset: 0;
  background: rgba(15, 35, 40, 0.48);
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s ease,
              visibility .3s ease;
  z-index: 1000
}

#menuOverlay.active {
  opacity: 1;
  visibility: visible
}

/* ==========================================
   DRAWER
========================================== */

.sidenav {
  position: fixed;
  top: 0;
  left: 0;
  width: 380px;
  max-width: 92vw;
  height: 100%;
  height: 100dvh;

  background: #ffffff;

  border-radius: 0 16px 16px 0;

  transform: translateX(-100%);
  transition: transform .35s cubic-bezier(
    0.4, 0, 0.2, 1
  );

  z-index: 2000;

  box-shadow: 10px 0 40px rgba(0, 0, 0, 0.16);

  overflow: hidden
}

.sidenav.open {
  transform: translateX(0)
}

/* ==========================================
   HEADER
========================================== */

.menu-topbar {
  width: 100%;
  height: 62px;

  background: #008080;

  display: flex;
  align-items: center;

  padding: 0 24px;

  box-sizing: border-box;

  border-bottom: 1px solid rgba(255,255,255,0.15)
}

/* HEADER CONTENT */

.menu-top-content {
  width: 100%;

  display: flex;
  align-items: center;

  color: #fff;

  font-size: 16px;
  font-weight: 600;
  letter-spacing: .1px;

  transition:
    opacity .2s ease,
    transform .2s ease
}

/* MAIN HEADER */

.menu-top-content.is-main {
  justify-content: flex-start
}

/* BACK HEADER */

.menu-top-content.is-back {
  justify-content: flex-start;
  cursor: pointer
}

.menu-top-content.is-back:hover {
  color: #d6f5f2
}

/* HEADER ANIMATIONS */

.menu-top-content.swap-out {
  opacity: 0;
  transform: translateY(-4px)
}

.menu-top-content.swap-in {
  opacity: 1;
  transform: translateY(0)
}

/* ==========================================
   MENU PANELS
========================================== */

.menu-panel {
  position: absolute;

  top: 62px;
  bottom: 0;
  left: 0;
  right: 0;

  padding: 12px 12px 24px;

  overflow-y: auto;
  overscroll-behavior: contain;

  background: #ffffff;

  opacity: 0;
  transform: translateX(20px);
  pointer-events: none;

  transition:
    opacity .28s ease,
    transform .28s ease
}

.menu-panel.active {
  opacity: 1;
  transform: translateX(0);
  pointer-events: auto
}

/* ==========================================
   CATEGORY LIST
========================================== */

.menu-panel ul {
  margin: 0;
  padding: 0;
  list-style: none
}

.menu-panel li {
  position: relative;
  list-style: none;

  margin: 2px 0;

  padding: 13px 38px 13px 16px;

  border-radius: 8px;

  background: transparent;

  color: #263238;

  font-size: 14px;
  font-weight: 500;
  line-height: 1.45;

  cursor: pointer;

  transition:
    background .2s ease,
    color .2s ease
}

/* CATEGORY HOVER */

.menu-panel li:hover {
  background: #eaf7f6;
  color: #006d6d
}

/* ==========================================
   SUBCATEGORY LINKS
========================================== */

.menu-panel li a {
  display: block;

  color: inherit;
  text-decoration: none;

  font-size: inherit;
  font-weight: inherit;

  transition: color .2s ease
}

.menu-panel li a:hover,
.menu-panel li a:focus {
  color: #006d6d;
  text-decoration: none
}

/* ==========================================
   CATEGORY ARROWS
========================================== */

.menu-panel li::after {
  content: "\f054";

  font-family: FontAwesome;
  font-size: 11px;
  font-weight: normal;

  position: absolute;

  right: 17px;
  top: 50%;

  transform: translateY(-50%);

  color: #91aaa8;

  pointer-events: none;

  transition:
    color .2s ease,
    transform .2s ease
}

/* ARROW HOVER */

.menu-panel li:hover::after {
  color: #008080;
  transform: translateY(-50%) translateX(2px)
}

/* ==========================================
   SUBMENU
========================================== */

#panel-sub li {
  padding-top: 12px;
  padding-bottom: 12px
}

#panel-sub li a {
  color: #37474f
}

#panel-sub li:hover a {
  color: #006d6d
}

/* ==========================================
   SCROLLBAR
========================================== */

.menu-panel {
  scrollbar-width: thin;
  scrollbar-color: #c7dedd transparent
}

/* ==========================================
   OPEN MENU BUTTON
========================================== */

#openMenu {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  gap: 9px;

  min-height: 42px;
  max-height: 42px;

  padding: 10px 16px;

  background: #ffffff;

  color: #006d6d;

  border: 1px solid #b9dada;
  border-radius: 8px;

  font-size: 14px;
  font-weight: 600;

  cursor: pointer;

  box-shadow: none;

  transition:
    background .2s ease,
    border-color .2s ease,
    color .2s ease;

  position: relative;
  z-index: 101
}

/* BUTTON HOVER */

#openMenu:hover {
  background: #eaf7f6;
  border-color: #008080;
  color: #005e5e;
  transform: none;
  box-shadow: none
}

/* BUTTON ACTIVE */

#openMenu:active {
  background: #dff2f0;
  transform: none;
  box-shadow: none
}

/* KEYBOARD FOCUS */

#openMenu:focus-visible {
  outline: 2px solid #008080;
  outline-offset: 3px
}

/* ==========================================
   MOBILE
========================================== */

@media (max-width: 480px) {

  .sidenav {
    width: 340px;
    max-width: 92vw;
    border-radius: 0 12px 12px 0
  }

  .menu-topbar {
    height: 58px;
    padding: 0 20px
  }

  .menu-top-content {
    font-size: 15px
  }

  .menu-panel {
    top: 58px;
    padding: 10px 10px 24px
  }

  .menu-panel li {
    font-size: 14px;
    padding: 13px 36px 13px 14px;
    margin: 2px 0
  }

  .menu-panel li::after {
    right: 15px
  }

  #openMenu {
    min-height: 40px;
    max-height: 40px;
    padding: 9px 13px;
    font-size: 13px
  }
}

/* ==========================================
   REDUCED MOTION
========================================== */

@media (prefers-reduced-motion: reduce) {

  .sidenav,
  .menu-panel,
  .menu-top-content,
  .menu-panel li,
  .menu-panel li::after,
  #openMenu {
    transition: none
  }
}

/* =========================
   Top Menu
========================= */
.topmenu {
  position: relative
}

.topmenu .container {
  padding: 0
}

.topmenuList {
  display: flex;
  margin: 0;
  padding: 0;
  list-style: none;
  height: 40px
}

.topmenuItem {
  flex: 1 1 0;
  background: transparent;
  text-align: center;
  transition: .2s ease;
  margin-bottom: 0
}

.topmenuItem a {
  display: block;
  padding: 8px 10px;
  color: #3dbbbb;
  text-decoration: none;
  font-weight: 600;
  text-transform: uppercase;
  white-space: nowrap
}

/* =========================
   MEGA MENU WRAPPER
========================= */
.megaMenu {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  width: 100%;

  display: none;
  z-index: 999;
 background: var(--menu-bg, #ffffff);
 box-shadow: 0 12px 10px rgba(0, 0, 0, 0.12)
}

.megaMenu.active {
  display: block
}

.megaInner {
  max-width: 1450px;
  width: 100%;
  margin: 0 auto;   /* centers under top menu */
  position: relative;
  border-radius: 0;  /* no floating card look */
  overflow: hidden;
  padding: 15px
}

.megaInner::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;

  background: var(--menu-bg, #fff);
  transition: background .35s ease
}

/* ensure content sits above background */
#megaContent {
  position: relative;
  z-index: 1
}

/* =========================
   GRID
========================= */
.megaGrid {
  display: grid;
  grid-template-columns:
    minmax(0, 15fr)
    minmax(0, 15fr)
    minmax(0, 15fr)
    minmax(0, 15fr)
    minmax(0, 30fr);
  gap: 20px
}

/* =========================
   LINK BOX
========================= */
.megaCol {
  background: #ffffff;
  padding: 15px;
  border-radius: 6px;
  border: 1px solid #e0e0e0
}

.megaCol h4 {
  margin: 0 0 15px;
  font-size: 14px
}

.megaCol a {
  display: block;
  font-size: 14px;
  padding: 5px 0;
  text-decoration: none
}

.viewAll {
  font-weight: bold;
  margin-top: 8px;
  display: block
}

/* =========================
   BANNER
========================= */
.megaBanner img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 6px
}

.megaBanner a {
  display: block
}
/* =========================
   LINK ARROWS
========================= */
.megaCol a {
  position: relative;
  padding-right: 18px; /* space for arrow */
}

/* FontAwesome arrow */
.megaCol a::after {
  content: "\f054";
  font-family: "Font Awesome 5 Free"; /* or 6 depending on your setup */
  font-weight: 900;

  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);

  font-size: 11px;
  opacity: 0.6;
  transition: .2s ease
}

/* hover effect */
.megaCol a:hover {
text-decoration: none
}

/* arrow animation on hover */
.megaCol a:hover::after {
  transform: translateY(-50%) translateX(4px);
  opacity: 1
}

@media (min-width: 768px) {

  .topmenuList {
    position: relative
  }

  .topmenuItem {
    position: relative
  }

}

.megaTopStrip {
  display: flex;
  align-items: stretch;
  justify-content: space-between;

  background: #f5f5f5;
  border-radius: 6px;
  overflow: hidden;
  margin-bottom: 12px
}

.megaTopLeft {
  padding: 12px 16px;
  display: flex;
  align-items: center;
  flex: 1;

  background: #ffffff
}

.megaTopLeft h3 {
  margin: 0;
  font-size: 16px;
  font-weight: 600
}

.megaTopRight {
  display: flex
}

.megaTopRight a {
  position: relative;

  display: flex;
  align-items: center;

  padding: 0 16px;
  height: 100%;

  background: #008080;
  text-decoration: none;
  font-size: 13px;
  font-weight: 600;

  transition: all .25s ease;
  color: #fff
}

.megaTopRight a::after {
  content: "\f054";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;

  margin-left: 8px;
  font-size: 11px;
  opacity: 0.6;
  transition: .2s ease
}

.megaTopRight a:hover {
  background: #3dbbbb;
  color: #fff
}

.megaTopRight a:hover::after {
  opacity: 1;
  transform: translateX(3px)
}

.megaTopStrip:hover .megaTopRight a {
  background: #3dbbbb;
  color: #fff
}

.megaTopStrip:hover .megaTopRight a::after {
  opacity: 1;
  transform: translateX(3px)
}

.megaGrid--offers {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px
}

.megaGrid--offersSplit {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  margin-top: 20px
}

.megaGrid--offers .megaBanner {
  width: 100%
}

.megaGrid--offers .megaBanner img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 6px
}

.megaGrid--offers .megaBanner {
  overflow: hidden;
  border-radius: 6px
}

.megaGrid--offers .megaBanner img {
  transition: transform .3s ease
}

.megaGrid--offers .megaBanner:hover img {
  transform: scale(1.05)
}

.megaGrid--offers {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  align-items: stretch
}

.megaPromoCard {
  position: relative;
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 2px 10px rgba(0,0,0,0.08);
  transition: transform .25s ease, box-shadow .25s ease
}

.megaBadge {
  position: absolute;
   bottom: 70px;
   right: 20px;
    background: #272727;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  padding: 5px 8px;
  border-radius: 4px;
  z-index: 2;
  letter-spacing: .5px
}

.megaPromoImage {
  display: block;
  overflow: hidden
}

.megaPromoImage img {
  width: 100%;
  display: block;
  transition: transform .35s ease
}

.megaPromoContent {
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 10px
}

.megaPromoContent h4 {
  font-size: 14px;
  margin: 0
}

.megaPromoBtn {
display: inline-block;
    padding: 8px 10px;
    background: #008080;
    color: #fff;
    text-decoration: none;
    font-size: 13px;
    text-align: center;
    border-radius: 6px;
    transition: .2s ease;
    font-weight: 700
}

.megaPromoBtn:hover {
background: #3dbbbb;
color: #fff
}

.megaPromoCard:hover {
box-shadow: 0 10px 25px rgba(0,0,0,0.15)
}

.megaPromoCard:hover .megaPromoImage img {
  transform: scale(1.04)
}

/* Furniture / Seating / Soft Seating */
.megaFurnitureLayout {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px
}

.megaFurnitureLinks {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px
}

.megaFurnitureImages {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px
}

.megaImageTile {
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: 10px;
  background: #10231d;
  min-height: 190px;
  text-decoration: none
}

.megaImageTile img {
  width: 100%;
  height: 100%;
  min-height: 190px;
  object-fit: cover;
  display: block;
  transition: transform .35s ease
}

.megaImageTile:hover img {
  transform: scale(1.05)
}

.megaImageTile span {
  position: absolute;
  left: 14px;
  bottom: 14px;
  z-index: 2;

  display: inline-block;
  padding: 8px 13px;

  background: rgba(16, 35, 29, .88);
  color: #fff;

  border-left: 4px solid #008080;
  border-radius: 4px;

  font-size: 13px;
  font-weight: 800;
  line-height: 1.2;

  transition: all .25s ease
}

.megaImageTile:hover span {
  background: #008080;
  color: #fff;
  transform: translateY(-2px)
}

/* Offers: 3 top + 3 bottom + large right image */
.megaOffersNew {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 22px
}

.megaOffersSmall {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px
}

.megaOffersLarge .megaImageTile {
  height: 100%;
  min-height: 525px
}

.megaOffersLarge .megaImageTile img {
  height: 100%
}

@media (max-width: 900px) {
  .megaFurnitureLayout,
  .megaOffersNew {
    grid-template-columns: 1fr
  }

  .megaFurnitureLinks,
  .megaFurnitureImages,
  .megaOffersSmall {
    grid-template-columns: repeat(2, 1fr)
  }
}

.topmenuItem > a {
  position: relative
}

/* =====================================
   TOP MENU - REFINED NAVIGATION
===================================== */

/* Main category heading */
.topmenuItem > a {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;

  padding: 8px 6px;
  color: #3dbbbb;
  font-weight: 600;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
  cursor: pointer;
  transition: color .2s ease
}

/* Small downward chevron */
.topmenuItem > a::after {
  content: "";
  position: static;
  display: block;

  width: 7px;
  height: 7px;
  flex-shrink: 0;

  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;

  transform: translateY(-2px) rotate(45deg);
  opacity: 0.65;
  transition: transform .2s ease, opacity .2s ease
}

/* Underline, only beneath the text area */
.topmenuItem > a::before {
  display: none
}

/* Hover and active state */
.topmenuItem:hover > a,
.topmenuItem.active > a,
.topmenuItem > a:focus-visible {
  color: #008080;
  font-weight: 600
}

/* Animate chevron */
.topmenuItem:hover > a::after,
.topmenuItem.active > a::after,
.topmenuItem > a:focus-visible::after {
  opacity: 1;
  transform: translateY(0) rotate(225deg)
}

/* Keyboard focus indicator */
.topmenuItem > a:focus-visible {
  outline: 2px solid #008080;
  outline-offset: -2px
}

@media (prefers-reduced-motion: reduce) {
  .topmenuItem > a,
  .topmenuItem > a::after {
    transition: none
  }
}

.login-prompt-popup {
  position: fixed;
  top: 30%;
  right: 20px;

  width: 340px;
  background: #ffffff;
  border-radius: 12px;

  border: 1px solid rgba(0,0,0,0.06);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.12);

  padding: 0;
  z-index: 9999;

  transform: translateX(120%);
  opacity: 0;

  transition: transform .35s ease, opacity .35s ease;
  overflow: hidden;
  font-family: inherit
}

.login-prompt-popup.visible {
  transform: translateX(0);
  opacity: 1
}

/* subtle top accent bar */
.login-prompt-popup::before {
  content: "";
  display: block;
  height: 4px;
  background: #3dbbbb
}

/* content spacing */
.login-prompt-content {
  padding: 16px 16px 14px
}

/* title */
.login-prompt-content p strong {
  font-size: 15px;
  color: #111;
  display: block;
  margin-bottom: 6px
}

/* body text */
.login-prompt-content p {
  margin: 0 0 10px;
  font-size: 13.5px;
  line-height: 1.45;
  color: #555
}

/* actions layout */
.actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 12px
}

/* primary button */
.btn-login {
background: #008080;
    color: #fff;
    padding: 8px 14px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    text-decoration: none;
    transition: all .2s ease;
    width: 100px;
    text-align: center
}

.btn-login:hover {
  background: #3dbbbb;
  transform: translateY(-1px);
  color: #fff
}

/* secondary action */
.btn-close {
  background: transparent;
  border: none;
  color: #777;
  font-size: 12.5px;
  cursor: pointer;
  padding: 6px 4px
}

.btn-close:hover {
  color: #333
}

/* Item Swaps */

.itemswapcontent {
border: 1px solid #3dbbbb;
border-radius: 5px;
width: 360px;
outline: solid #0e0e0e99 2000px;
transition: all .5s ease-in
}

.itemswapcontent button.close {
display: none
}

.price-saving {
background: #3dbbbb;
color: #000;
font-weight: 700;
padding: 7px 15px;
margin-bottom: 5px;
font-size: 16px
}

.itemswapcontent .title {
font-size: 20px
}

.itemswapcontent .listitems {
border-radius: 10px;
border: 1px solid #3dbbbb
}

body.ex-product .arrow_down:after  {
border-left-color: #3dbbbb
}

.itemswapcontent .product-detail .product-name a:hover {
font-weight: 500
}

.itemswapcontent .product-detail .list-attribute, .itemswapcontent .product-detail strong {
display: none
}

.itemswapcontent .product-detail .price-label  {
font-size: 18px
}

.itemswapcontent .product-detail .uom {
display: none
}

.itemswapcontent .product-detail .buttons.group {
margin-top: 2px
}

.itemswapcontent .btn-swap-continue  {
width: 100%;
border-radius: 5px;
border: 1px solid #b2b2b2;
background: #e6f7f7
}

.itemswapcontent .btn-swap-continue:hover {
color: #fff;
background: #008080
}

.itemswapcontent .product-detail{
margin-top: 3px
}

.itemswapcontent .col-md-4 {
width: 42%
}

.col-md-7.product-detail {
width: 50%
}

.itemswapcontent p {
    margin-bottom: 15px;
    color: #6c6c6c;
    font-size: 14px;
    font-weight: 700
}

.itemswapcontent  span.live-inventory-v2-shipping.text-danger.out-stock:after{
display: none}

/* =========================================
   BULK ORDERS MODAL ONLY
========================================= */

/* TRIGGER BUTTON */

.bulkorders-trigger {
    background: #111;
    color: #fff;
    border: 0;
    padding: 14px 24px;
    border-radius: 8px;
    font-weight: 600;
    transition: all .3s ease
}

.bulkorders-trigger:hover {
    background: #333;
    color: #fff
}

/* MODAL LAYOUT */

/* =========================================
   BULK ORDERS RIGHT FLYOVER MODAL
   NO LEFT IMAGE
========================================= */

/* REMOVE DEFAULT BOOTSTRAP FADE */

.bulkorders-modal.fade .bulkorders-dialog {
    right: -100%;
    transform: none;
    transition: right .4s cubic-bezier(.77,0,.18,1)
}

/* SLIDE IN */

.bulkorders-modal.in .bulkorders-dialog {
    right: 0
}

/* DIALOG */

.bulkorders-modal .bulkorders-dialog {
    position: fixed;
    top: 0;
    right: -100%;
    margin: 0;
    width: 100%;
    max-width: 620px;
    height: 100%;
    z-index: 1051
}

/* CONTENT */

.bulkorders-modal .bulkorders-content {
    height: 100vh;
    border: 0;
    border-radius: 0;
    overflow-y: auto;
    background: #fff;
    box-shadow: -10px 0 40px rgba(0,0,0,.2)
}

/* BODY */

.bulkorders-body {
    min-height: 100vh;
    background: #fff
}

/* FORM AREA */

.bulkorders-form-wrapper {
position: relative
}

bulkorders-form-header {
padding: 25px;
background: #d2f4ff
}

/* TITLE */

.bulkorders-form-wrapper h2 {
    font-size: 30px;
    font-weight: 700;
    margin-bottom: 15px;
    color: #111;
    line-height: 1.2
}

/* INTRO */

.bulkorders-intro {
    font-size: 15px;
    line-height: 1.51;
    color: #454545;
    margin-bottom: 15px
}

/* CLOSE BUTTON */

.bulkorders-close {
    position: absolute;
    top: 18px;
    right: 22px;
    border: 0;
    background: transparent;
    font-size: 40px;
    line-height: 1;
    color: #111;
    z-index: 9;
    cursor: pointer;
    opacity: 1
}

/* FORM GRID */

.bulkorders-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
  padding: 25px
}

.bulkorders-full {
    grid-column: span 2
}

.bulkorders-form-footer {
padding: 25px
}

/* LABELS */

.bulkorders-group label {
    display: block;
    margin-bottom: 8px;
    font-size: 14px;
    font-weight: 600;
    color: #222
}

/* INPUTS */

.bulkorders-modal .form-control {
    width: 100%;
    height: auto;
    padding: 14px 16px;
    border: 1px solid #ddd;
    border-radius: 10px;
    box-shadow: none;
    font-size: 15px;
    transition: all .25s ease;
    background: #fff
}

.bulkorders-modal .form-control:focus {
    border-color: #111;
    box-shadow: 0 0 0 3px rgba(0,0,0,.05)
}

.bulkorders-modal textarea.form-control {
    resize: vertical;
    min-height: 120px
}

/* SUBMIT BUTTON */

.bulkorders-submit {
    width: 100%;
    margin-top: 20px;
    border: 0;
    background: #111;
    color: #fff;
    padding: 16px;
    border-radius: 10px;
    font-size: 16px;
    font-weight: 600;
    transition: background .3s ease
}

.bulkorders-submit:hover {
    background: #333
}

/* SUCCESS */

.bulkorders-success {
    margin-top: 20px;
    background: #edf9ed;
    color: #1c6b1c;
    padding: 15px;
    border-radius: 10px
}

/* BACKDROP */

.bulkorders-modal {
    background: rgba(0,0,0,.6)
}

/* MOBILE */

@media (max-width: 768px) {

    .bulkorders-modal .bulkorders-dialog {
        max-width: 100%
    }

    .bulkorders-form-wrapper {
        padding: 35px 20px
    }

    .bulkorders-grid {
        grid-template-columns: 1fr
    }

    .bulkorders-full {
        grid-column: span 1
    }

    .bulkorders-form-wrapper h2 {
        font-size: 28px
    }

}

.bulkorders-modal .bulkorders-content button.btn.btn-default {
width: 100%;
margin-top: 20px;
border: 0;
background: #3dbbbb;
color: #fff;
padding: 16px;
border-radius: 10px;
font-size: 16px;
font-weight: 600;
transition: background .3s ease
}

.bulkorders-modal .bulkorders-content button.btn.btn-default:hover {
background: #049af3
}

.bulkorders-form-header {
padding: 25px;
background: #e6f7f7
}

.bulk-order-trigger {
display: inline-flex;
    align-items: center;
    gap: 10px;
    border-radius: 8px;
    font-weight: 600;
    cursor: pointer;
background: #e6f7f7;
    color: #000;
    padding: 14px 24px;
    width: 100%;
    margin-top: 10px;
    margin-bottom: 10px;
    justify-content: center;
    font-size: 16px;
    box-shadow: rgba(50, 50, 93, 0.25) 0 6px 12px -2px, rgba(0, 0, 0, 0.3) 0 3px 7px -3px;
    border: 1px solid #0000001a
}

.bulk-order-trigger:hover {
background: #c5edea
}

.bulk-order-icon {
    width: 40px;
    height: 40px;
    display: block
}

/* Price Promise */
.promise-page,
.promise-page *{
    box-sizing:border-box
}

.promise-page{
    font-family:'Inter',sans-serif;
    color:#111827;
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility
}

/* =========================
   CONTAINER
========================= */

.promise-page .promise-container{
    max-width:1200px;
    margin:0 auto
}

/* =========================
   HERO
========================= */

.promise-page .promise-hero{
    position:relative;
    overflow:hidden;
    border-radius:32px;
    padding:50px 70px;
    margin-bottom:35px;
background: url(https://eu.evocdn.io/dealer/1022/content/media/cos-header-service1.png) no-repeat center;
        background-size: cover;
    border:2px solid #3dbbbb3d;
    color:#111827
}

.promise-page .promise-hero h1{
    font-size:40px;
    line-height:1;
    font-weight:800;
    margin-bottom:20px;
    letter-spacing:-2px;
    color:#111827
}

.promise-page .promise-hero p{
    font-size:18px;
    line-height:1.8;
    max-width:760px;
    color:#4b5563
}

/* =========================
   GRID
========================= */

.promise-page .promise-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
    gap:28px;
    margin-bottom:28px
}

/* =========================
   CARDS / SECTIONS
========================= */

.promise-page .promise-card,
.promise-page .promise-section{
    background:#ffffff;
    margin-bottom: 10px;
    border:1px solid #eceff3;

    border-radius:28px;

    padding:38px;

    box-shadow:
    0 4px 20px rgba(15,23,42,0.04);

    transition:
    transform .25s ease,
    box-shadow .25s ease,
    border-color .25s ease
}

.promise-page .promise-card:hover,
.promise-page .promise-section:hover{
    transform:translateY(-4px);

    border-color:#3dbbbb3d;

    box-shadow:
    0 15px 40px rgba(15,23,42,0.08)
}

.promise-page .promise-card h2,
.promise-page .promise-section h2{
    font-size:30px;
    margin-bottom:20px;
    font-weight:700;
    letter-spacing:-1px;
    color:#111827
}

.promise-page .promise-section{
    margin-bottom:28px
}

.promise-page .promise-section h3{
    font-size:20px;
    margin-bottom:18px;
    color:#111827
}

/* =========================
   SPLIT GRID
========================= */

.promise-page .promise-split{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
    gap:40px
}

/* =========================
   LISTS
========================= */

.promise-page ul{
    list-style:none;
    display:grid;
    gap:16px;
    padding:0;
    margin:0
}

.promise-page li{
    display:flex;
    align-items:flex-start;
    gap:14px;

    color:#4b5563;

    line-height:1.6;
    font-size:17px;
    font-weight:500
}

.promise-page li::before{
    content:"";

    flex-shrink:0;

    width:14px;
    height:14px;

    margin-top:7px;

    border-radius:50%;

    background: linear-gradient(135deg, #008080, #3dbbbb);;

    box-shadow: 0 0 0 4px #3dbbbb3d
}

/* =========================
   NOTES
========================= */

.promise-page .promise-note{
    margin-top:28px;

    background: linear-gradient(135deg, #3dbbbb3d, #f8fbff);

    border: 1px solid #3dbbbb;

    border-radius:20px;

    padding:22px 24px;

    color: #008080;

    font-weight:500;

    line-height:1.7;

    font-size:15px
}

/* =========================
   TEXT
========================= */

.promise-page p{
    color:#4b5563;
    line-height:1.8;
    font-size:18px
}

/* =========================
   FOOTER
========================= */

.promise-page .promise-footer{
    text-align:center;
    padding:25px 10px 0;
    color:#94a3b8;
    font-size:14px
}

/* =========================
   RESPONSIVE
========================= */

@media(max-width:768px){

    .promise-page .promise-hero{
        padding:40px 28px;
        border-radius:24px
    }

    .promise-page .promise-hero h1{
        font-size:38px
    }

    .promise-page .promise-hero p{
        font-size:16px
    }

    .promise-page .promise-card,
    .promise-page .promise-section{
        padding:28px;
        border-radius:22px
    }

    .promise-page .promise-card h2,
    .promise-page .promise-section h2{
        font-size:26px
    }

}
.promise-grid-2{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:16px
}

.promise-card{
    padding:16px;
    border:1px solid #e6e6e6;
    border-radius:10px;
    background:#fff
}

.promise-hours{
    display:flex;
    flex-direction:column;
    gap:10px;
    max-width:420px
}

.promise-hours-row{
    display:flex;
    justify-content:space-between;
    padding:10px 14px;
    border:1px solid #eee;
    border-radius:8px;
    background:#fff
}

.promise-hours-split{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
    gap:30px;
    margin-top:30px
}

.promise-hours-row.closed{
    opacity:0.7
}

.promise-day{
    font-weight:600
}

.promise-time{
    font-weight:500
}

.filter-container section.quicklinks {
    background: white;
    border-radius: 10px;
    box-shadow: 4px 4px 6px 0 rgba(0, 0, 0, .05), -4px -4px 6px 0 hsla(0, 0%, 100%, .3);
    border: 1px solid #cccccc;
margin-bottom: 10px
}

.filter-container section.quicklinks li a {
    padding: 6px 10px;
    border-bottom: 1px solid #efefef;
    transition: all .3s ease-in-out;
    color: var(--evo-text-col, #878787);
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 1.1em;
    line-height: 2
}
.filter-container section.quicklinks .title {
    background: #008080;
    color: #fff;
    padding: 15px 12px;
    text-transform: capitalize;
    font-size: 1.125em;
    margin: 0;
    border-radius: 10px 10px 0 0
}

.filter-container section.quicklinks li a::after  {
content: "\f054";
font: normal normal normal 10px / 1 FontAwesome;
float: right;
color: #3dbbbb
}

.filter-container section.quicklinks li {
    margin: 0
}

.filter-container section.quicklinks li a:hover {
    background: #3dbbbb1c
}

form.contact-form.contactform {
    background: #ffffff;
    border: 1px solid #eceff3;
    border-radius: 28px;
    padding: 38px;
    box-shadow: 0 4px 20px rgba(15, 23, 42, 0.04);
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease
}

/* LPP Popup  */
.catalog-single .product-title {
  font-size: 22px
}

/* tooltip base */
.low-price-pledge-popup {
  position: absolute;
  width: 360px;
  z-index: 9999;
  background: rgba(51, 204, 255, 0.92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);

  color: #fff;
  border-radius: 12px;
  padding: 14px 16px;

  font-size: 14px;
  line-height: 1.5;

  opacity: 0;
  transform: translateY(8px) scale(0.98);
  transition: opacity .22s ease, transform .22s ease
}

/* arrow */
.low-price-pledge-popup::before {
  position: absolute;
  bottom: 100%;
  left: 24px;
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 10px 10px 10px;
  border-color: transparent transparent rgba(51, 204, 255, 0.92) transparent
}

/* show state with premium feel */
.low-price-pledge-popup.show {
  opacity: 1;
  transform: translateY(0) scale(1);
  animation: lppShadowIn .25s ease forwards
}

/* premium shadow entrance */
@keyframes lppShadowIn {
  from {
    box-shadow: 0 0 0 rgba(0,0,0,0)
  }
  to {
    box-shadow: 0 12px 30px rgba(0,0,0,0.18)
  }
}

/* typography */
.lpp-title {
  font-size: 22px;
  font-weight: 600;
  margin-bottom: 6px
}

.lpp-phone {
  font-size: 22px;
  font-weight: 600;
  margin-top: 6px
}

.lpp-text {
  margin-top: 8px;
  opacity: 0.95
}

.lpp-link {
  display: inline-block;
  margin-top: 10px;
  padding: 8px 10px;

  background: rgba(255, 255, 255, 0.18);
  border-radius: 8px;

  color: #fff;
  text-decoration: none;
  font-weight: 500;

  transition: background .2s ease, transform .2s ease
}

.lpp-link:hover {
  background: rgba(255, 255, 255, 0.28);
  transform: translateY(-1px)
}

/* ====================================
   COUNTY OFFICE SUPPLIES
   SERVICE HEADER BANNER
==================================== */

.service-banner {
    background: #b2dfdb;
    border-top: 1px solid #bfe8e8;
    border-bottom: 1px solid #bfe8e8;
    padding: 7px 0
}

div#htmlcontent_306784 {
    background: #b2dfdb
}

.service-banner .container {
    margin: 0 auto;
}

.service-banner__flex {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: 12px
}

/* Individual service boxes */
.service-banner__box {
    position: relative;
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    background: #e6f7f7;
    border: 1px solid transparent;
    border-radius: 8px;
    transition:
        background .2s ease,
        border-color .2s ease,
        box-shadow .2s ease
}

.service-banner__box:hover {
    background: #ffffff;
    border-color: #80cbc4;
    box-shadow: 0 2px 8px rgba(0, 80, 80, 0.08)
}

/* Icons */
.service-banner__icon {
    flex: 0 0 36px;
    display: flex;
    align-items: center;
    justify-content: center
}

.service-banner__icon img {
    width: 34px;
    height: 34px;
    object-fit: contain;
    display: block
}

/* Text */
.service-banner__box p {
    margin: 0;
    font-size: 12.5px;
    line-height: 1.45;
    color: #111111
}

.service-banner__box strong {
    font-size: 14px;
    font-weight: 700;
    color: #172b29
}

/* Clickable overlay */
.service-banner__link {
    position: absolute;
    inset: 0;
    z-index: 2;
    border-radius: inherit
}

.service-banner__link:focus-visible {
    outline: 2px solid #008080;
    outline-offset: 2px
}

/* Existing header section */
.container-fluid.headersection-6 {
    background: #f5f5f5
}

/* ====================================
   TABLET
==================================== */
@media (max-width: 1100px) {

    .service-banner__flex {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px
    }

    .service-banner__box {
        padding: 8px 12px
    }
}

/* ====================================
   MOBILE
==================================== */
@media (max-width: 600px) {

    .service-banner {
        padding: 6px 0
    }

    .service-banner .container {
        padding: 0 10px
    }

    .service-banner__flex {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 6px
    }

    .service-banner__box {
        gap: 7px;
        padding: 8px;
        border-radius: 6px
    }

    .service-banner__icon {
        flex-basis: 26px
    }

    .service-banner__icon img {
        width: 25px;
        height: 25px
    }

    .service-banner__box strong {
        font-size: 11px
    }

    .service-banner__box p {
        font-size: 10px;
        line-height: 1.35
    }
}

/* Very narrow phones */
@media (max-width: 360px) {

    .service-banner__flex {
        grid-template-columns: 1fr
    }

    .service-banner__box {
        padding: 7px 10px
    }
}

@media only screen and (max-width: 767px) {
footer ol li, footer ul:not(.hasSubmenus,.submenu) li {
border: 0 solid #fff}
}
@media only screen and (max-width: 991px) {
.shop-filters .filter-section label :not(.swatch-option,.btn-default) {
padding: 0
}
}

@media only screen and (max-width: 768px) {
section.search {
padding: 5px 15px
}
}

@media only screen and (max-width: 768px){
.ms-slide-bgcont {
border: 1px solid #e6e6e6 !important;
border-radius: 10px
}
}

@media only screen and (max-width: 770px) {
.searchtools .search {
border-radius: 10px
}
}

/* Main Page Rebuild */

/* ==========================================
   UPGRADED HERO BANNER
========================================== */

.cos-hero-banner {
    position: relative;
    min-height: 600px;
    border-radius: 0;
    overflow: hidden
}

/* Background image now in HTML */

.cos-hero-banner .cos-hero-image {
    position: absolute;
    inset: 0;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    display: block;
    z-index: 0
}

/* Keep existing overlay above image */

.cos-hero-banner .cos-hero-overlay {
    position: relative;
    z-index: 1
}
.cos-hero-overlay {
  min-height: 600px;
  background: linear-gradient(
    90deg,
    rgba(0, 0, 0, 0.50) 0%,
    rgba(0, 0, 0, 0.32) 42%,
    rgba(0, 0, 0, 0.05) 100%
  );
  display: flex;
  align-items: center
}

.cos-hero-content {
  max-width: 1024px;
  padding: 60px 7%;
  color: #fff
}

.cos-hero-label {
  display: inline-block;
  margin-bottom: 35px;
  padding: 7px 13px;
  background: #292c2ea1;
  border-left: 4px solid #008080;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .4px;
  text-transform: uppercase
}

.cos-hero-content h1 {
  margin: 0 0 18px;
  font-size: clamp(38px, 5vw, 50px);
  line-height: 1.05;
  font-weight: 800;
  color: #fff
}

.cos-hero-content p {
  margin: 0 0 28px;
  font-size: 20px;
  line-height: 1.45
}

.cos-hero-buttons {
  display: flex;
  gap: 16px;
  flex-wrap: wrap
}

.cos-btn-primary {
  background: #008080;
  color: #fff
}

.cos-btn-primary:hover {
  background: #3dbbbb;
  color:#fff
}

@media (max-width: 767px) {

    /* HERO CONTENT */
    .cos-hero-content {
        position: relative;
        top: auto;
        left: auto;
        right: auto;
        transform: none;

        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        padding: 38px 20px;
        text-align: left
    }

    /* SMALL HEADING */
    .cos-hero-content span {
        display: inline-block;
        font-size: 11px;
        line-height: 1.4;
        letter-spacing: 1px;
        margin-bottom: 16px
    }

    /* MAIN HEADING */
    .cos-hero-content h1 {
        font-size: clamp(30px, 8vw, 38px);
        line-height: 1.12;
        margin: 0 0 16px;
        font-weight: 700
    }

    /* DESCRIPTION */
    .cos-hero-content p {
        font-size: 15px;
        line-height: 1.5;
        margin: 0 0 22px;
        max-width: 100%
    }

}

.cos-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 50px;
  padding: 0 26px;
  border-radius: 4px;
  font-size: 15px;
  font-weight: 800;
  text-decoration: none
}

.cos-btn-secondary {
  background: #ffffff;
  color: #10231d
}

/* ==========================================
   HERO CATEGORY CARDS
========================================== */

.cos-hero-category-strip {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
  padding: 28px 5%;
  background: #ffffff;
  margin-top: -65px;
  position: relative;
  z-index: 3
}

.cos-hero-category {
  display: grid;
  grid-template-columns: 120px 1fr;
  align-items: center;
  gap: 20px;
  padding: 18px;
  background: #ffffff;
  border-radius: 10px;
  color: #10231d;
  text-decoration: none;
  box-shadow: 0 12px 32px rgba(0,0,0,0.12);
  transition: transform .25s ease, box-shadow .25s ease
}

.cos-hero-category:hover {
  transform: translateY(-4px);
  box-shadow: 0 16px 38px rgba(0,0,0,0.16)
}

.cos-hero-category img {
  width: 120px;
  height: 95px;
  object-fit: cover;
  border-radius: 7px;
  display: block
}

.cos-hero-category h3 {
  margin: 0 0 6px;
  font-size: 20px;
  color: #10231d
}

.cos-hero-category p {
  margin: 0;
  font-size: 14px;
  line-height: 1.45;
  color: #4c5a55
}

/* ==========================================
   RESPONSIVE
========================================== */

@media (max-width: 1100px) {
  .cos-hero-category-strip {
    grid-template-columns: 1fr;
    margin-top: 0
  }

  .cos-hero-category {
    grid-template-columns: 150px 1fr
  }

  .cos-hero-category img {
    width: 150px;
    height: 100px
  }
}

@media (max-width: 700px) {
  .cos-hero-upgraded,
  .cos-hero-overlay {
    min-height: 560px;

    background: linear-gradient(
      180deg,
      rgba(0,0,0,0.78) 0%,
      rgba(0,0,0,0.48) 100%
    )
  }

  .cos-hero-content {
    padding: 50px 24px
  }

  .cos-hero-content p {
    font-size: 17px
  }

  .cos-hero-buttons {
    flex-direction: column
  }

  .cos-btn {
    width: 100%;
    box-sizing: border-box
  }

  .cos-hero-category-strip {
    padding: 22px 20px
  }

  .cos-hero-category {
    grid-template-columns: 1fr
  }

  .cos-hero-category img {
    width: 100%;
    height: 170px
  }
}
.cos-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 24px;
  border-radius: 4px;
  font-size: 15px;
  font-weight: 700;
  text-decoration: none
}

.cos-btn-secondary:hover {
background: #f2f2f2;
color: #049acf
}

@media (max-width: 768px) {
  .cos-hero-banner,
  .cos-hero-overlay {
    min-height: 520px;

    background: linear-gradient(
      180deg,
      rgba(0, 0, 0, 0.72) 0%,
      rgba(0, 0, 0, 0.48) 100%
    )
  }

  .cos-hero-content {
    padding: 42px 24px
  }

  .cos-hero-buttons {
    flex-direction: column;
    align-items: flex-start
  }

  .cos-btn {
    width: 100%;
    max-width: 280px
  }
}

/* ==========================================
   HIDE HOMEPAGE HERO ON MOBILE ONLY
========================================== */

@media (max-width: 767px) {

    .cos-hero {
        display: none !important
    }

}

.cos-benefits-strip {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  background: #ffffff;
  border-bottom: 1px solid #e7e7e7;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.04)
}

.cos-benefit {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 24px 22px;
  border-right: 1px solid #e6e6e6;
  justify-content: center
}

.cos-benefit:last-child {
  border-right: none
}

.cos-benefit-img {
  width: 38px;
  height: 38px;
  object-fit: contain;
  flex-shrink: 0
}

.cos-benefit h3 {
  margin: 0 0 5px;
  font-size: 14px;
  font-weight: 800;
  color: #10231d;
  text-transform: uppercase
}

.cos-benefit p {
  margin: 0;
  font-size: 13px;
  color: #4c5a55;
  line-height: 1.35
}

@media (max-width: 1100px) {
  .cos-benefits-strip {
    grid-template-columns: repeat(3, 1fr)
  }
}

@media (max-width: 760px) {
  .cos-benefits-strip {
    grid-template-columns: repeat(2, 1fr)
  }
}

@media (max-width: 520px) {
  .cos-benefits-strip {
    grid-template-columns: 1fr
  }

  .cos-benefit {
    border-right: none;
    padding: 22px 24px;
    justify-content: left
  }
}

.cos-furniture-collections {
  padding: 20px 2% 56px;
  background: #ffffff;
  margin-top: 15px
}

.cos-section-heading {
  text-align: center;
  margin-bottom: 28px
}

.cos-section-heading h2 {
  margin: 0 0 8px;
  font-size: 30px;
  line-height: 1.2;
  color: #10231d
}

.cos-section-heading p {
  margin: 0;
  font-size: 16px;
  color: #5f6b67
}

.cos-collection-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 22px
}

.cos-collection-card {
  display: block;
  background: #ffffff;
  border-radius: 8px;
  overflow: hidden;
  text-decoration: none;
  color: #10231d;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  transition: transform .2s ease, box-shadow .2s ease
}

.cos-collection-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.12)
}

.cos-collection-card img {
  width: 100%;
  height: 230px;
  display: block;
  object-fit: cover
}

.cos-collection-content {
  padding: 22px 22px 24px
}

.cos-collection-content h3 {
  margin: 0 0 8px;
  font-size: 20px;
  color: #10231d
}

.cos-collection-content p {
  margin: 0 0 16px;
  font-size: 15px;
  line-height: 1.45;
  color: #4c5a55
}

.cos-collection-content span {
  font-size: 15px;
  font-weight: 800;
  color: #008080
}

@media (max-width: 1100px) {
  .cos-collection-grid {
    grid-template-columns: repeat(2, 1fr)
  }

  .cos-collection-card img {
    height: 260px
  }
}

@media (max-width: 620px) {
  .cos-furniture-collections {
    padding: 15px 20px 20px
  }

  .cos-section-heading h2{
  font-size: 28px
  }

  .cos-collection-grid {
    grid-template-columns: 1fr;
    gap: 15px
  }

  .cos-collection-content {
  padding: 10px
  }

  .cos-collection-content h3 {
    margin: 0 0 6px;
    font-size: 18px;
    color: #10231d
}

  .cos-collection-content span {
    font-size: 13px;
    font-weight: 800;
    color: #008080
   }

  .cos-collection-content p {
    margin: 0 0 10px;
    font-size: 14px;
    line-height: 1.35;
    color: #4c5a55
   }

  .cos-collection-card img {
    height: 200px
  }
}

.cos-fitout-section {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 44px;
  align-items: center;
  padding: 64px 5%;
  background: #f5f7f6
}

.cos-fitout-image img {
  width: 100%;
  height: 430px;
  object-fit: cover;
  display: block;
  border-radius: 10px;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.12)
}

.cos-fitout-content {
  max-width: 560px
}

.cos-fitout-label {
  display: inline-block;
  margin-bottom: 14px;
  color: #008080;
  font-size: 14px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .5px
}

.cos-fitout-content h2 {
  margin: 0 0 18px;
  font-size: clamp(30px, 4vw, 30px);
  line-height: 1.1;
  color: #10231d
}

.cos-fitout-content p {
  margin: 0 0 24px;
  font-size: 17px;
  line-height: 1.6;
  color: #4c5a55
}

.cos-fitout-list {
  list-style: none;
  padding: 0;
  margin: 0 0 20px;
  display: grid;
  gap: 5px
}

.cos-fitout-list li {
  position: relative;
  padding-left: 30px;
  font-size: 16px;
  font-weight: 700;
  color: #10231d
}

.cos-fitout-list li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: -1px;
  color: #3dbbbb;
  font-weight: 900
}

.cos-fitout-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 50px;
  padding: 0 26px;
  background: #008080;
  color: #fff;
  border-radius: 4px;
  font-size: 15px;
  font-weight: 800;
  text-decoration: none
}

.cos-fitout-btn:hover {
background: #3dbbbb;
color: #fff
}

@media (max-width: 900px) {
  .cos-fitout-section {
    grid-template-columns: 1fr;
    padding: 30px 24px
  }

  .cos-fitout-content h2{
   font-size: clamp(28px, 4vw, 28px)
  }

  .cos-fitout-content p {
  font-size: 16px
  }

   .cos-fitout-image img {
    height: 320px
  }
}

/* ==========================================
   SOFT SEATING SECTION
========================================== */

.cos-soft-seating {
  padding: 50px 2%;
  background: #ffffff
}

.cos-soft-heading {
  max-width: 800px;
  margin-bottom: 35px
}

.cos-soft-heading span {
  display: inline-block;
  margin-bottom: 10px;
  color: #008080;
  font-size: 14px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .5px
}

.cos-soft-heading h2 {
  margin: 0 0 10px;
  font-size: 42px;
  line-height: 1.1;
  color: #10231d
}

.cos-soft-heading p {
  margin: 0;
  font-size: 17px;
  line-height: 1.6;
  color: #4c5a55
}

/* ==========================================
   GRID LAYOUT
========================================== */

.cos-soft-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1.3fr;
  grid-template-rows: repeat(2, 260px);
  gap: 20px
}

.cos-soft-card {
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  text-decoration: none;
  display: block;
  background: #10231d
}

.cos-soft-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .4s ease
}

.cos-soft-card:hover img {
  transform: scale(1.05)
}

.cos-soft-feature {
  grid-column: 3;
  grid-row: 1 / span 2
}

/* ==========================================
   STANDARD OVERLAYS
========================================== */

.cos-soft-overlay {
  position: absolute;
  inset: 0;
display: flex;
  align-items: flex-end;
  padding: 24px;
background: linear-gradient(180deg, rgba(0, 0, 0, 0) 50%, rgba(7, 20, 16, .80) 100%)
}

.cos-soft-overlay h3 {
  margin: 0 0 6px;
  font-size: 24px;
  line-height: 1.2;
  color: #fff;
  text-shadow: -1px 1px 2px #454545
}

.cos-soft-overlay p {
  margin: 0;
  font-size: 14px;
  line-height: 1.45;
  color: rgba(255,255,255,0.92);
  max-width: 280px;
  text-shadow: -1px 1px 2px #454545
}

/* SMALL CARDS - TITLE TOP, DESCRIPTION BOTTOM */

.cos-workstations-card.cos-small-split .cos-soft-overlay {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    justify-content: space-between;
    padding: 20px;

    background: linear-gradient(
        180deg,
        rgba(7, 20, 16, 0.65) 0%,
        rgba(0, 0, 0, 0) 35%,
        rgba(0, 0, 0, 0) 55%,
        rgba(7, 20, 16, 0.80) 100%
    )
}

/* Stretch inner container to full height */
.cos-workstations-card.cos-small-split .cos-soft-overlay > div {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex: 1;
    min-height: 0
}

/* Title at the top */
.cos-workstations-card.cos-small-split .cos-soft-overlay h3 {
    margin: 0;
    font-size: 24px;
    line-height: 1.2
}

/* Description at the bottom */
.cos-workstations-card.cos-small-split .cos-soft-overlay p {
    margin: 0;
    font-size: 14px;
    line-height: 1.45
}

/* ==========================================
   LARGE FEATURE IMAGE
========================================== */

.cos-soft-overlay-large {
   position: absolute;
    inset: 0;

    display: flex;
    flex-direction: column;

    padding: 40px;
background: linear-gradient(180deg, rgba(0, 0, 0, 0) 50%, rgba(7, 20, 16, .80) 100%)
}

.cos-soft-overlay-large span {
    display: inline-block;
    align-self: flex-start;

    padding: 8px 14px;

    background: #292c2ea1;
    border-left: 4px solid #008080;

    color: #fff;
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .5px
}
.cos-soft-overlay-large h3 {
  margin: 0 0 12px;
  font-size: 42px;
  line-height: 1.1;
  color: #fff
}

.cos-soft-overlay-large p {
  margin: 0;
  max-width: 450px;
  font-size: 17px;
  line-height: 1.6;
  color: rgba(255,255,255,0.95)
}

/* ==========================================
   RESPONSIVE
========================================== */

@media (max-width: 1100px) {

  .cos-soft-grid {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: auto
  }

  .cos-soft-card {
    height: 250px
  }

  .cos-soft-feature {
    grid-column: 1 / -1;
    grid-row: auto;
    height: 420px
  }
}

@media (max-width: 768px) {

  .cos-soft-seating {
    padding: 50px 20px
  }

  .cos-soft-grid {
     display: flex;
    flex-direction: column
  }

  .cos-soft-feature {
    order: -1
  }

  .cos-soft-card,
  .cos-soft-feature {
    height: 260px
  }

  .cos-soft-heading h2 {
    font-size: 32px
  }

  .cos-soft-overlay h3 {
    font-size: 22px
  }

  .cos-soft-overlay-large h3 {
    font-size: 30px
  }

  .cos-soft-overlay-large {
    padding: 25px
  }
}
/* ==========================================
   FEATURED BEST SELLERS
========================================== */

.cos-best-sellers {
    padding: 25px 2%;
    background: #f7f8f8
}

.cos-best-heading {
    text-align: center;
    max-width: 800px;
    margin: 0 auto 15px
}

.cos-best-heading span {
    display: inline-block;
    margin-bottom: 10px;
    color: #008080;
    font-size: 14px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .5px
}

.cos-best-heading h2 {
    margin: 0 0 10px;
    font-size: 30px;
    color: #10231d;
    line-height: 1.1
}

.cos-best-heading p {
    margin: 0;
    color: #5c6764;
    font-size: 17px;
    line-height: 1.6
}

/* ==========================================
   GRID
========================================== */

.cos-product-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 22px
}

/* ==========================================
   CARD
========================================== */

.cos-product-card {
    background: #ffffff;
    border-radius: 10px;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    box-shadow: 0 8px 20px rgba(0,0,0,.06);
    transition: all .25s ease
}

.cos-product-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 34px rgba(0,0,0,.12)
}

.cos-product-image {
    background: #ffffff;
    padding: 20px
}

.cos-product-image img {
    width: 100%;
    height: 220px;
    object-fit: contain;
    display: block
}

.cos-product-content {
    padding: 20px
}

.cos-product-sku {
    display: block;
    margin-bottom: 8px;
    font-size: 12px;
    font-weight: 700;
    color: #8b9592;
    text-transform: uppercase
}

.cos-product-content h3 {
    margin: 0 0 10px;
    font-size: 20px;
    line-height: 1.25;
    color: #10231d
}

.cos-product-content p {
    margin: 0 0 15px;
    font-size: 14px;
    line-height: 1.5;
    color: #5c6764
}

.cos-product-colours {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    margin-bottom: 18px;
  min-height: 60px
}

.cos-colour-swatch {
    width: 25px;
    height: 25px;
    border: 1px solid #d9d9d9;
    display: block;
    transition: transform .2s ease;
  border-radius: 50%
}

.cos-colour-swatch:hover {
    transform: scale(1.15)
}

.cos-product-price {
    margin-bottom: 18px;
    font-size: 16px;
    font-weight: 800;
    color: #008080
}

.cos-product-button {
background: #008080;
    display: table;
    margin: 0 auto;
    padding: 12px 24px;
    color: #fff;
    border-radius: 4px;
    font-size: 14px;
    font-weight: 700;
    text-align: center;
    transition: background .25s ease
}

.cos-product-card:hover .cos-product-button {
    background: #3dbbbb
}

/* ==========================================
   RESPONSIVE
========================================== */

@media (max-width: 1400px) {
    .cos-product-grid {
        grid-template-columns: repeat(3, 1fr)
    }
}

@media (max-width: 900px) {
    .cos-product-grid {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media (max-width: 600px) {

    .cos-best-sellers {
        padding: 20px
    }

    .cos-product-grid {
        grid-template-columns: 1fr
    }

    .cos-best-heading h2 {
        font-size: 32px
    }
}

.cos-product-badge {
    display: inline-block;
    padding: 5px 10px;
    margin-bottom: 12px;
    background: #3dbbbb1c;
    color: #008080;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    border-radius: 20px
}
/* ==========================================
   ACOUSTIC SCREENS SECTION
========================================== */

.cos-acoustic-options {
  padding: 50px 2%;
  background: #ffffff
}

.cos-acoustic-heading {
  max-width: 800px;
  margin-bottom: 35px
}

.cos-acoustic-heading span {
  display: inline-block;
  margin-bottom: 10px;
  color: #008080;
  font-size: 14px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .5px
}

.cos-acoustic-heading h2 {
  margin: 0 0 10px;
  font-size: 42px;
  line-height: 1.1;
  color: #10231d
}

.cos-acoustic-heading p {
  margin: 0;
  font-size: 17px;
  line-height: 1.6;
  color: #4c5a55
}

.cos-acoustic-grid {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1fr;
  grid-template-rows: repeat(2, 260px);
  gap: 20px
}

.cos-acoustic-card {
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  text-decoration: none;
  display: block;
  background: #10231d
}

.cos-acoustic-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .35s ease
}

.cos-acoustic-card:hover img {
  transform: scale(1.05)
}

/* Large image on LEFT */
.cos-acoustic-feature {
  grid-column: 1;
  grid-row: 1 / span 2
}

.cos-acoustic-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: flex-end;
  padding: 24px;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.05) 20%, rgb(0 0 0 / 30%) 100%)
}

.cos-acoustic-overlay h3 {
  margin: 0 0 6px;
  font-size: 24px;
  color: #fff;
  line-height: 1.2;
  text-shadow: -1px 1px 2px #454545
}

.cos-acoustic-overlay p {
  margin: 0;
  font-size: 14px;
  line-height: 1.4;
  color: rgba(255,255,255,0.9);
  max-width: 280px;
  text-shadow: -1px 1px 2px #454545
}

.cos-acoustic-overlay-large {
position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    padding: 40px;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.05) 15%, rgb(0 0 0 / 30%) 100%)
}

.cos-acoustic-overlay-large span {
 display: inline-block;
    align-self: flex-start;
    padding: 8px 14px;
    background: #292c2ea1;
    border-left: 4px solid #008080;
    color: #fff;
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .5px
}

.cos-acoustic-overlay-large h3 {
  margin: 0 0 15px;
  font-size: 40px;
  line-height: 1.1
}

.cos-acoustic-overlay-large p {
  max-width: 450px;
  font-size: 17px;
  line-height: 1.6
}

/* Responsive */
@media (max-width: 1100px) {
  .cos-acoustic-grid {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: auto
  }

  .cos-acoustic-card {
    height: 250px
  }

  .cos-acoustic-feature {
    grid-column: 1 / -1;
    height: 420px
  }
}

@media (max-width: 700px) {
  .cos-acoustic-grid {
    grid-template-columns: 1fr
  }

  .cos-acoustic-card,
  .cos-acoustic-feature {
    height: 250px
  }

  .cos-acoustic-heading h2 {
    font-size: 32px
  }

  .cos-acoustic-overlay-large h3 {
    font-size: 30px
  }
}
/* ==========================================
   WORKSTATIONS SECTION
========================================== */

.cos-workstations {
  padding: 50px 2%;
  background: #ffffff
}

.cos-workstations-grid {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1fr;
  grid-template-rows: repeat(2, 260px);
  gap: 20px
}

.cos-workstations-feature {
  grid-column: 1;
  grid-row: 1 / span 2
}

.cos-workstations-card {
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  display: block;
  text-decoration: none;
  min-height: 260px;
  background: #10231d
}

.cos-workstations-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .35s ease
}

.cos-workstations-card:hover img {
  transform: scale(1.05)
}

/* Tablet */
@media (max-width: 1100px) {
  .cos-workstations-grid {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: auto
  }

  .cos-workstations-card {
    height: 250px
  }

  .cos-workstations-feature {
    grid-column: 1 / -1;
    grid-row: auto;
    height: 420px
  }
}

/* Mobile */
@media (max-width: 700px) {
  .cos-workstations {
    padding: 50px 20px
  }

  .cos-workstations-grid {
    grid-template-columns: 1fr
  }

  .cos-workstations-card,
  .cos-workstations-feature {
    height: 260px
  }
}

.cos-overlay-bottom {
    margin-top: auto
}

.cos-overlay-bottom h3 {
    margin: 0 0 12px;
    font-size: 30px;
    line-height: 1.1;
    color: #fff;
    text-shadow: -1px 1px 2px #454545
}

.cos-overlay-bottom p {
    margin: 0;
    max-width: 450px;
    font-size: 17px;
    line-height: 1.6;
    color: rgba(255,255,255,0.95);
    text-shadow: -1px 1px 2px #454545
}

.cos-trusted-brands {
  padding: 15px 2%;
  background: #ffffff
}

.cos-brands-heading {
  text-align: center;
  max-width: 1024px;
  margin: 0 auto 35px
}

.cos-brands-heading span {
  display: inline-block;
  margin-bottom: 10px;
  color: #008080;
  font-size: 14px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .5px
}

.cos-brands-heading h2 {
  margin: 0 0 10px;
  font-size: 42px;
  line-height: 1.1;
  color: #10231d
}

.cos-brands-heading p {
  margin: 0;
  font-size: 17px;
  line-height: 1.6;
  color: #4c5a55
}

.cos-brands-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 18px
}

.cos-brand-card {
  min-height: 70px;
  padding: 10px;
  background: #f7f8f8;
  border: 1px solid #e6e9e8;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all .25s ease
}

.cos-brand-card:hover {
  background: #ffffff;
  transform: translateY(-3px);
  box-shadow: 0 12px 28px rgba(0,0,0,.08)
}

.cos-brand-card img {
  max-width: 150px;
  max-height: 65px;
  width: 100%;
  object-fit: contain;
  display: block
}

@media (max-width: 1100px) {
  .cos-brands-grid {
    grid-template-columns: repeat(3, 1fr)
  }
}

@media (max-width: 600px) {
  .cos-trusted-brands {
    padding: 20px
  }

   .cos-brands-heading p {
    font-size: 16px
  }

  .cos-brands-grid {
    grid-template-columns: repeat(2, 1fr)
  }

  .cos-brands-heading h2 {
    font-size: 22px
  }

  .cos-brand-card {
    min-height: 70px;
    padding: 18px
  }
}

/* ==========================================
   COS - PLANNING A NEW OFFICE CTA
   COMPLETE CSS - PERFORMANCE OPTIMISED
========================================== */

/* Main CTA Container */
.cos-office-cta {
    position: relative;
    isolation: isolate;
    padding: 90px 5%;
    margin-bottom: 15px;
    border-radius: 10px;
    overflow: hidden;
    background-color: #263b3b
}

/* Background Image */
.cos-office-cta-image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    z-index: 0
}

/* Dark Gradient Overlay */
.cos-office-cta-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
        90deg,
        rgba(0, 0, 0, 0.68) 0%,
        rgba(0, 0, 0, 0.42) 55%,
        rgba(0, 0, 0, 0.05) 100%
    );
    z-index: 1;
    pointer-events: none
}

/* Content Above Image and Gradient */
.cos-office-cta-content {
    position: relative;
    z-index: 2;
    max-width: 760px;
    color: #fff
}

/* Small Heading Label */
.cos-office-cta-content span {
    display: inline-block;
    margin-bottom: 14px;
    padding: 8px 14px;
    background: #7c7c7c7a;
    border-left: 4px solid #008080;
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .5px
}

/* Main Heading */
.cos-office-cta-content h2 {
    margin: 0 0 18px;
    font-size: clamp(36px, 5vw, 50px);
    line-height: 1.05;
    color: #fff
}

/* Description */
.cos-office-cta-content p {
    margin: 0 0 30px;
    max-width: 650px;
    font-size: 18px;
    line-height: 1.6;
    color: rgba(255, 255, 255, 0.92)
}

/* Buttons Container */
.cos-office-cta-buttons {
    display: flex;
    gap: 16px;
    flex-wrap: wrap
}

/* Shared Button Styling */
.cos-office-cta-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 50px;
    padding: 0 26px;
    border-radius: 4px;
    font-size: 15px;
    font-weight: 800;
    text-decoration: none;
    text-align: center;
    transition: background-color .2s ease, color .2s ease
}

/* Primary Button */
.cos-office-cta-primary {
    background: #008080;
    color: #fff
}

/* Secondary Button */
.cos-office-cta-secondary {
    background: #ffffff;
    color: #10231d
}

/* Primary Button Hover */
.cos-office-cta-primary:hover {
    background: #3dbbbb;
    color: #fff
}

/* Secondary Button Hover */
.cos-office-cta-secondary:hover {
    background: #f2f2f2;
    color: #008080
}

/* ==========================================
   MOBILE - 700px AND BELOW
========================================== */

@media (max-width: 700px) {

    .cos-office-cta {
        padding: 30px 20px
    }

    .cos-office-cta-image {
        object-position: center
    }

    .cos-office-cta-content h2 {
        font-size: clamp(30px, 5vw, 50px)
    }

    .cos-office-cta-content p {
        font-size: 16px
    }

    .cos-office-cta-buttons {
        flex-direction: column
    }

    .cos-office-cta-btn {
        width: 100%;
        box-sizing: border-box
    }

}
/* =========================
   Mega Menu - Homepage Match
========================= */

.megaInner {
  width: 100%;
  max-width: 1450px;
  margin: 0 auto;
padding: 10px 5px 24px
}

.megaCol,
.megaPromoCard,
.megaTopStrip {
  background: #ffffff;
  border-radius: 10px;
  border: none;
box-shadow: rgba(0, 0, 0, 0.02) 0 1px 3px 0, rgba(27, 31, 35, 0.15) 0 0 0 1px;
  transition: transform .25s ease, box-shadow .25s ease
}

.megaCol:hover,
.megaPromoCard:hover {
  transform: translateY(-4px);
box-shadow: rgba(60, 64, 67, 0.3) 0 1px 2px 0, rgba(60, 64, 67, 0.15) 0 1px 3px 1px
}

.megaCol h4,
.megaTopLeft h3,
.megaPromoContent h4 {
  color: #10231d;
  font-weight: 800
}

.megaCol a {
  color: #4c5a55
}

.megaCol a:hover,
.viewAll,
.megaTopRight a {
  color: #008080
}

.megaCol a::after,
.megaTopRight a::after {
  color: #008080
}

.megaPromoBtn,
.megaTopRight a {
  background: #008080;
  color: #fff;
  border-radius: 4px;
  font-weight: 800
}

.megaPromoBtn:hover,
.megaTopRight a:hover {
  background: #3dbbbb;
  color: #fff
}

.megaBadge {
  background: #008080;
  color: #fff;
  border-radius: 20px
}

.topmenuItem a {
  color: #008080;
  font-weight: 800
}

.topmenuItem:hover a {
  color: #10231d
}

.topmenuItem:hover,
.topmenuItem.active {
  position: relative
}
.megaPromoCard--overlay {
  position: relative;
  overflow: hidden
}

.megaPromoCard--overlay .megaPromoImage {
  position: relative;
  display: block;
  overflow: hidden;
  height: 100%
}

.megaPromoCard--overlay .megaPromoImage img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transition: transform .35s ease
}

.megaPromoCard--overlay:hover .megaPromoImage img {
  transform: scale(1.04)
}

.megaImageOverlay {
  position: absolute;
  left: 14px;
  bottom: 14px;
  z-index: 2;

  display: inline-block;
  padding: 8px 13px;

  background: rgba(16, 35, 29, .88);
  color: #fff;

  border-left: 4px solid #008080;
  border-radius: 4px;

  font-size: 13px;
  font-weight: 800;
  line-height: 1.2;

  transition: all .25s ease
}

.megaPromoCard--overlay:hover .megaImageOverlay {
  background: #008080;
  color: #fff;
  transform: translateY(-2px)
}

.search-v2-category:hover {
background: #e6f7f7;
border-color: #3dbbbb
}

.search-v2-category {
border: 1px solid #3dbbbb3d
}

.search-v2__pill {
border: 1px solid #3dbbbb3d
}
.search-v2__pill:hover {
color: #008080;
background: #e6f7f7;
border-color: #3dbbbb
}
.search-v2-product:hover {
background-color: #effdfa78
}
.search-v2 .owl-carousel .owl-nav button:hover {
background-color: #fff
}

.search-v2__section-title {
color: #008080
}

.bundle-modal-item{
border: 2px solid #bfe8e8;
box-shadow: rgba(0, 0, 0, 0.1) 0 1px 3px 0, rgba(0, 0, 0, 0.06) 0 1px 2px 0
}

.bundle-modal-item-image {
border-right: 1px solid #bfe8e8
}

.bundle-modal-item-action {
border-left: 1px solid #bfe8e8
}

.bundle-modal-item.is-selected  {
border-color: #008080
}

body.has-myaccount-2 .modal .modal-content.product-bundle-modal-content {
padding: 0 ! Important
}

body.has-myaccount-2 .modal .product-bundle-modal-header {
background: #e6f7f7;
border: 1px solid #bfe8e8;
padding: 10px 25px
}

.bundle-preview-actions .bundle-skip-link {
    display: block;
    margin-top: 12px;
    border-radius: 5px;
    font-size: 15px;
    min-width: 255px;
    padding: 8px 20px;
    background: #c6c6c6;
    color: #000;
    font-weight: 500;
  text-decoration: none
}

.bundle-preview-actions .bundle-skip-link:hover {
    background: #454545;
    color: white
}

.bundle-preview-type-label {
    color: #008080
}

.modal-content {
border: 3px solid #008080
}

.btn-xs-outlined {
    border: 1px solid #3dbbbb;
    color: #008080 !important
}

body.has-myaccount-2 .modal .modal-content {
padding: 10px !important
}

/* ==========================================
   PREMIUM MINIMAL BREADCRUMB
========================================== */

#breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0;

    margin: 0 0 32px;
    padding: 8px 0;

    list-style: none;

    animation: breadcrumbFade .5s ease
}

#breadcrumb li {
    display: flex;
    align-items: center;
    margin: 0;
    padding: 0
}

/* Standard links */
#breadcrumb li a {
    position: relative;

    color: #5c6763;
    text-decoration: none;

    font-size: 14px;
    line-height: 1.4;
    font-weight: 500;
    letter-spacing: .2px;

    white-space: nowrap;

    transition: color .25s ease
}

/* Animated underline */
#breadcrumb li a::after {
    content: "";

    position: absolute;
    left: 0;
    bottom: -4px;

    width: 0;
    height: 2px;

    background: #008080;

    transition: width .3s ease
}

/* Hover */
#breadcrumb li a:hover {
    color: #099
}

#breadcrumb li a:hover::after {
    width: 100%
}

/* Home link */
#breadcrumb li:first-child:not(:last-child) a {
    color: #8a9793
}

#breadcrumb li:first-child:not(:last-child) a:hover {
    color: #099
}

/* Current page */
#breadcrumb li:last-child a {
    color: #008080;

    font-weight: 700;
    letter-spacing: .2px;

    pointer-events: none
}

/* Do not show underline on current page */
#breadcrumb li:last-child a::after {
    display: none
}

/* Separator */
#breadcrumb li:not(:last-child)::after {
    content: "/";

    display: inline-block;

    margin: 0 14px;

    color: #d9dfdc;

    font-size: 14px;
    line-height: 1;
    font-weight: 300
}

/* Remove existing theme separators */
.breadcrumb > li + li::before {
    display: none !important;
    content: none !important
}

/* Remove existing breadcrumb icons */
#breadcrumb li i,
#breadcrumb li i::before {
    display: none !important
}

/* Subtle page-load animation */
@keyframes breadcrumbFade {
    from {
        opacity: 0;
        transform: translateY(-6px)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

/* ==========================================
   TABLET
========================================== */

@media (max-width: 900px) {

    #breadcrumb {
        margin-bottom: 24px
    }

    #breadcrumb li a {
        font-size: 13px
    }

    #breadcrumb li:not(:last-child)::after {
        margin: 0 10px
    }

}

/* ==========================================
   MOBILE
========================================== */

@media (max-width: 768px) {

    #breadcrumb {
        flex-wrap: nowrap;
        overflow-x: auto;

        margin-bottom: 20px;
        padding: 7px 0 11px;

        white-space: nowrap;

        scrollbar-width: none;
        -webkit-overflow-scrolling: touch
    }

    #breadcrumb::-webkit-scrollbar {
        display: none
    }

    #breadcrumb li {
        flex: 0 0 auto
    }

    #breadcrumb li:not(:last-child)::after {
        margin: 0 9px
    }

}
/* =====================================================
   DYNAMIC SEARCH RESULTS BANNER
===================================================== */

#cosSearchBanner {
    display: none;
    width: 100%;
    height: 350px;
    position: relative;
    overflow: hidden;
    margin: 0 0 30px;
    box-sizing: border-box;
    background-color: #f2f8f8;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover
}

/* Show banner when a category has been detected */
#cosSearchBanner.is-visible {
    display: block;
    animation: cosBannerFadeIn .45s ease forwards
}

/* Dark gradient over the banner image */
.cos-category-banner-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;
background: linear-gradient(90deg, rgba(0, 0, 0, 0.50) 0%, rgba(0, 0, 0, 0.45) 42%, rgba(0, 0, 0, 0.05) 100%)
}

/* Banner content */
.cos-category-banner-content {
    width: 100%;
    max-width: 1400px;
    height: 100%;
    position: relative;
    z-index: 2;

    margin: 0 auto;
    padding: 35px 50px;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;

    box-sizing: border-box;
    color: #fff
}

/* Small label above heading */
.cos-category-banner-label {
display: inline-flex;
    align-items: center;
    margin: 0 0 12px;
    padding: 6px 12px;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    color: #fff;
    font-size: 11px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 1.4px;
    background: #292c2ea1;
    border-left: 4px solid #008080
}

/* Main banner heading */
.cos-category-banner-title {
    max-width: 650px;
    margin: 0 0 10px;

    color: #fff;
    font-size: clamp(32px, 4vw, 54px);
    line-height: 1.05;
    font-weight: 700;
    letter-spacing: -1px
}

/* Banner description */
.cos-category-banner-text {
    max-width: 610px;
    margin: 0 0 16px;

    color: rgba(255, 255, 255, 0.94);
    font-size: 17px;
    line-height: 1.5;
    font-weight: 400
}

/* Feature row */
.cos-category-banner-features {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 18px;

    margin: 0 0 22px
}

/* Individual feature */
.cos-category-banner-feature {
    display: inline-flex;
    align-items: center;
    gap: 7px;

    color: #fff;
    font-size: 13px;
    line-height: 1.3;
    font-weight: 600
}

/* Teal circular tick */
.cos-category-banner-feature-tick {
    width: 20px;
    height: 20px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 20px;

    border-radius: 50%;
    background: #3dbbbb;
    color: #fff;

    font-size: 12px;
    font-weight: 700
}

/* Call-to-action link */
.cos-category-banner-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;

    min-height: 42px;
    padding: 0 20px;

    border-radius: 6px;

    background: #008080;
    color: #fff !important;

    font-size: 14px;
    line-height: 1;
    font-weight: 700;
    text-decoration: none !important;

    transition:
        background .25s ease,
        border-color .25s ease,
        transform .25s ease
}

.cos-category-banner-link:hover {
    border-color: #3dbbbb;
    background: #3dbbbb;
    color: #fff !important;
    transform: translateY(-2px)
}

.cos-category-banner-arrow {
    font-size: 13px;
    transition: transform .25s ease
}

.cos-category-banner-link:hover .cos-category-banner-arrow {
    transform: translateX(3px)
}

/* Loading protection */
#cosSearchBanner img {
    max-width: 100%
}

/* Banner entrance */
@keyframes cosBannerFadeIn {
    from {
        opacity: 0;
        transform: translateY(8px)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

/* =====================================================
   TABLET
===================================================== */

@media screen and (max-width: 992px) {

    .cos-category-banner-content {
        padding: 30px 35px
    }

    .cos-category-banner-overlay {
background: linear-gradient(90deg, rgba(0, 0, 0, 0.50) 0%, rgba(0, 0, 0, 0.45) 42%, rgba(0, 0, 0, 0.05) 100%)
    }

    .cos-category-banner-title {
        max-width: 560px
    }

    .cos-category-banner-text {
        max-width: 530px
    }
}

/* =====================================================
   MOBILE
===================================================== */

@media screen and (max-width: 767px) {

    #cosSearchBanner {
        height: 300px;
        margin-bottom: 22px;
        border-radius: 8px;
        background-position: center
    }

    .cos-category-banner-overlay {
        background: rgba(0, 65, 65, 0.78)
    }

    .cos-category-banner-content {
        padding: 25px;
        justify-content: center
    }

    .cos-category-banner-label {
        margin-bottom: 9px;
        font-size: 10px
    }

    .cos-category-banner-title {
        margin-bottom: 9px;
        font-size: 33px;
        letter-spacing: -0.5px
    }

    .cos-category-banner-text {
        margin-bottom: 14px;
        font-size: 15px;
        line-height: 1.4
    }

    .cos-category-banner-features {
        gap: 7px 13px;
        margin-bottom: 17px
    }

    .cos-category-banner-feature {
        font-size: 12px
    }

    .cos-category-banner-feature-tick {
        width: 18px;
        height: 18px;
        flex-basis: 18px;
        font-size: 10px
    }

    .cos-category-banner-link {
        min-height: 39px;
        padding: 0 17px;
        font-size: 13px
    }
}

/* Smaller mobile screens */
@media screen and (max-width: 480px) {

    #cosSearchBanner {
        height: 320px
    }

    .cos-category-banner-content {
        padding: 22px
    }

    .cos-category-banner-title {
        font-size: 29px
    }

    .cos-category-banner-text {
        font-size: 14px
    }

    .cos-category-banner-features {
        display: grid;
        grid-template-columns: 1fr 1fr;
        width: 100%
    }
}

/* =====================================================
   MENU CATEGORY BANNER
===================================================== */

#cosCategoryBanner {
    display: none;
    width: 100%;
    height: 350px;
    position: relative;
    overflow: hidden;
    margin: 0 0 30px;
    box-sizing: border-box;
    background-color: #f2f8f8;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover
}

/* Show the banner when a category URL is detected */
#cosCategoryBanner.is-visible {
    display: block;
    animation: cosCategoryBannerFadeIn .45s ease forwards
}

/* Dark gradient over the banner image */
#cosCategoryBanner .cos-category-banner-overlay {
    position: absolute;
    inset: 0;
    z-index: 1;

background: linear-gradient(90deg, rgba(0, 0, 0, 0.50) 0%, rgba(0, 0, 0, 0.45) 42%, rgba(0, 0, 0, 0.05) 100%)
}

/* Banner content */
#cosCategoryBanner .cos-category-banner-content {
    width: 100%;
    max-width: 1400px;
    height: 100%;
    position: relative;
    z-index: 2;

    margin: 0 auto;
    padding: 35px 50px;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;

    box-sizing: border-box;
    color: #fff
}

/* Small label above heading */
#cosCategoryBanner .cos-category-banner-label {
display: inline-flex;
    align-items: center;
    margin: 0 0 12px;
    padding: 6px 12px;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    color: #fff;
    font-size: 11px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 1.4px;
    background: #292c2ea1;
    border-left: 4px solid #008080
}

/* Main banner heading */
#cosCategoryBanner .cos-category-banner-title {
    max-width: 650px;
    margin: 0 0 10px;

    color: #fff;
    font-size: clamp(32px, 4vw, 54px);
    line-height: 1.05;
    font-weight: 700;
    letter-spacing: -1px
}

/* Banner description */
#cosCategoryBanner .cos-category-banner-text {
    max-width: 610px;
    margin: 0 0 16px;

    color: rgba(255, 255, 255, 0.94);
    font-size: 17px;
    line-height: 1.5;
    font-weight: 400
}

/* Feature row */
#cosCategoryBanner .cos-category-banner-features {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px 18px;

    margin: 0 0 22px
}

/* Individual feature */
#cosCategoryBanner .cos-category-banner-feature {
    display: inline-flex;
    align-items: center;
    gap: 7px;

    color: #fff;
    font-size: 13px;
    line-height: 1.3;
    font-weight: 600
}

/* Teal circular tick */
#cosCategoryBanner .cos-category-banner-feature-tick {
    width: 20px;
    height: 20px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    flex: 0 0 20px;

    border-radius: 50%;
    background: #3dbbbb;
    color: #fff;

    font-size: 12px;
    line-height: 1;
    font-weight: 700
}

/* Call-to-action link */
#cosCategoryBanner .cos-category-banner-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;

    min-height: 42px;
    padding: 0 20px;

    border-radius: 6px;

    background: #008080;
    color: #fff !important;

    font-size: 14px;
    line-height: 1;
    font-weight: 700;
    text-decoration: none !important;

    transition:
        background .25s ease,
        border-color .25s ease,
        transform .25s ease
}

#cosCategoryBanner .cos-category-banner-link:hover {
    border-color: #3dbbbb;
    background: #3dbbbb;
    color: #fff !important;
    transform: translateY(-2px)
}

#cosCategoryBanner .cos-category-banner-arrow {
    font-size: 13px;
    transition: transform .25s ease
}

#cosCategoryBanner
.cos-category-banner-link:hover
.cos-category-banner-arrow {
    transform: translateX(3px)
}

/* Banner entrance */
@keyframes cosCategoryBannerFadeIn {
    from {
        opacity: 0;
        transform: translateY(8px)
    }

    to {
        opacity: 1;
        transform: translateY(0)
    }
}

/* Respect reduced-motion settings */
@media (prefers-reduced-motion: reduce) {

    #cosCategoryBanner.is-visible {
        animation: none
    }

    #cosCategoryBanner .cos-category-banner-link,
    #cosCategoryBanner .cos-category-banner-arrow {
        transition: none
    }
}

/* =====================================================
   TABLET
===================================================== */

@media screen and (max-width: 992px) {

    #cosCategoryBanner .cos-category-banner-content {
        padding: 30px 35px
    }

    #cosCategoryBanner .cos-category-banner-overlay {
background: linear-gradient(90deg, rgba(0, 0, 0, 0.50) 0%, rgba(0, 0, 0, 0.45) 42%, rgba(0, 0, 0, 0.05) 100%)
    }

    #cosCategoryBanner .cos-category-banner-title {
        max-width: 560px
    }

    #cosCategoryBanner .cos-category-banner-text {
        max-width: 530px
    }
}

/* =====================================================
   MOBILE
===================================================== */

@media screen and (max-width: 767px) {

    #cosCategoryBanner {
        height: 300px;
        margin-bottom: 22px;
        border-radius: 8px;
        background-position: center
    }

    #cosCategoryBanner .cos-category-banner-overlay {
        background: rgba(0, 65, 65, 0.78)
    }

    #cosCategoryBanner .cos-category-banner-content {
        padding: 25px;
        justify-content: center
    }

    #cosCategoryBanner .cos-category-banner-label {
        margin-bottom: 9px;
        font-size: 10px
    }

    #cosCategoryBanner .cos-category-banner-title {
        margin-bottom: 9px;
        font-size: 33px;
        letter-spacing: -0.5px
    }

    #cosCategoryBanner .cos-category-banner-text {
        margin-bottom: 14px;
        font-size: 15px;
        line-height: 1.4
    }

    #cosCategoryBanner .cos-category-banner-features {
        gap: 7px 13px;
        margin-bottom: 17px
    }

    #cosCategoryBanner .cos-category-banner-feature {
        font-size: 12px
    }

    #cosCategoryBanner .cos-category-banner-feature-tick {
        width: 18px;
        height: 18px;
        flex-basis: 18px;
        font-size: 10px
    }

    #cosCategoryBanner .cos-category-banner-link {
        min-height: 39px;
        padding: 0 17px;
        font-size: 13px
    }
}

/* Smaller mobile screens */
@media screen and (max-width: 480px) {

    #cosCategoryBanner {
        height: 320px
    }

    #cosCategoryBanner .cos-category-banner-content {
        padding: 22px
    }

    #cosCategoryBanner .cos-category-banner-title {
        font-size: 29px
    }

    #cosCategoryBanner .cos-category-banner-text {
        font-size: 14px
    }

    #cosCategoryBanner .cos-category-banner-features {
        display: grid;
        grid-template-columns: 1fr 1fr;
        width: 100%
    }
}

.list-attribute.product-bundle-badge .bundle-offer-badge {
    align-items: center;
    background-color: #3dbbbb
}

/* ==========================================================
   NO SEARCH RESULTS PAGE
   ========================================================== */

.no-results-page {
    --nr-green: #2f7d32;
    --nr-green-dark: #246428;

    --nr-text: #333333;
    --nr-grey: #808080;

    --nr-light-grey: #f7f8f8;
    --nr-border: #e7e9e9;

    --nr-white: #ffffff;

    color: var(--nr-text)
}

/* ==========================================================
   HERO
   ========================================================== */

.no-results-hero {
    max-width: 820px;
    margin: 0 auto;

    padding: 0 20px 60px;

    text-align: center
}

/* Eyebrow / Small Heading */

.no-results-eyebrow {
    display: inline-block;

    margin-bottom: 14px;

    color: var(--nr-green);

    font-size: 15px;
    font-weight: 700;

    letter-spacing: 1.7px;
    line-height: 1.4
}

/* Main Heading */

.no-results-hero h1 {
    margin: 0 0 20px;

    color: var(--nr-text);

    font-size: clamp(34px, 5vw, 54px);

    font-weight: 700;
    line-height: 1.1;

    letter-spacing: -1.5px
}

/* Intro Text */

.no-results-intro {
    max-width: 650px;

    margin: 0 auto;

    color: var(--nr-grey);

    font-size: 18px;
    line-height: 1.7
}

/* ==========================================================
   SEARCH TIPS SECTION
   ========================================================== */

.no-results-tips {
    padding: 65px 30px 75px;

    background: var(--nr-light-grey);

    border-radius: 24px
}

/* Tips Heading */

.no-results-heading {
    max-width: 650px;

    margin: 0 auto 40px;

    text-align: center
}

.no-results-heading h2 {
    margin: 0 0 12px;

    color: var(--nr-text);

    font-size: clamp(28px, 4vw, 38px);

    line-height: 1.2
}

.no-results-heading p {
    margin: 0;

    color: var(--nr-grey);

    font-size: 16px;
    line-height: 1.7
}

/* ==========================================================
   TIP CARD GRID
   DESKTOP = 3 COLUMNS / 2 ROWS
   ========================================================== */

.no-results-grid {
    display: grid;

    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 20px;

    max-width: 1200px;

    margin: 0 auto
}

/* ==========================================================
   TIP CARDS
   ========================================================== */

.no-results-card {
    display: flex;

    align-items: flex-start;

    gap: 16px;

    min-width: 0;

    padding: 26px 24px;

    background: var(--nr-white);

    border: 1px solid var(--nr-border);

    border-radius: 14px;

    transition:
        transform .2s ease,
        box-shadow .2s ease,
        border-color .2s ease
}

.no-results-card:hover {
    transform: translateY(-3px);

    border-color: rgba(47, 125, 50, 0.25);

    box-shadow:
        0 10px 28px rgba(0, 0, 0, 0.06)
}

/* Card Content */

.no-results-card-content {
    flex: 1;

    min-width: 0
}

/* ==========================================================
   CARD ICONS
   ========================================================== */

.no-results-icon {
    display: flex;

    flex: 0 0 44px;

    align-items: center;
    justify-content: center;

    width: 44px;
    height: 44px;

    color: var(--nr-green);

    background: rgba(47, 125, 50, 0.09);

    border-radius: 50%;

    font-size: 20px;
    font-weight: 700;

    line-height: 1
}

/* ==========================================================
   CARD TYPOGRAPHY
   ========================================================== */

.no-results-card h3 {
    margin: 1px 0 8px;

    color: var(--nr-text);

    font-size: 17px;

    font-weight: 700;

    line-height: 1.35
}

.no-results-card p {
    margin: 0;

    color: var(--nr-grey);

    font-size: 14px;

    line-height: 1.65
}

.no-results-card strong {
    color: var(--nr-text)
}

/* ==========================================================
   HELP CTA
   ========================================================== */

.no-results-help {
    margin-top: 30px;

    padding: 70px 30px;

    overflow: hidden;

    color: var(--nr-white);

    background:
        linear-gradient(
            135deg,
            #252a27 0%,
            #303833 100%
        );

    border-radius: 24px
}

/* Help Content */

.no-results-help-content {
    max-width: 720px;

    margin: 0 auto;

    text-align: center
}

/* Small heading */

.no-results-eyebrow-light {
    color: #9ac59c
}

/* Main CTA heading */

.no-results-help h2 {
    margin: 0 0 18px;

    color: var(--nr-white);

    font-size: clamp(30px, 4vw, 42px);

    line-height: 1.15
}

/* CTA text */

.no-results-help p {
    max-width: 650px;

    margin: 0 auto 10px;

    color: #4b5563;

    font-size: 16px;

    line-height: 1.7
}

/* ==========================================================
   CTA BUTTON ROW
   ========================================================== */

.no-results-actions {
    display: flex;

    flex-wrap: wrap;

    align-items: center;
    justify-content: center;

    gap: 12px;

    margin-top: 30px
}

/* Base Button */

.no-results-page .promise-button {
    display: inline-flex;

    align-items: center;
    justify-content: center;

    gap: 8px;

    min-height: 50px;

    padding: 13px 24px;

    border: 2px solid transparent;

    border-radius: 8px;

    font-size: 15px;
    font-weight: 700;

    line-height: 1.2;

    text-decoration: none;

    cursor: pointer;

    transition:
        background .2s ease,
        color .2s ease,
        border-color .2s ease,
        transform .2s ease
}

/* Button Hover Movement */

.no-results-page .promise-button:hover {
    transform: translateY(-2px);

    text-decoration: none
}

/* ==========================================================
   PRIMARY BUTTON
   ========================================================== */

.no-results-page .promise-button-primary {
    color: var(--nr-white);

    background: var(--nr-green);

    border-color: var(--nr-green)
}

.no-results-page .promise-button-primary:hover {
    color: var(--nr-white);

    background: var(--nr-green-dark);

    border-color: var(--nr-green-dark)
}

/* ==========================================================
   SECONDARY BUTTONS
   ========================================================== */

.no-results-page .promise-button-secondary {
    color: var(--nr-white);

    background: #3dbbbb;

    border-color: rgba(255, 255, 255, 0.45)
}

.no-results-page .promise-button-secondary:hover {
    color: #fff;

    background: #008080;

    border-color: var(--nr-white)
}

/* ==========================================================
   LIVE CHAT ICON
   ========================================================== */

.no-results-page .promise-button i {
    font-size: 16px;

    line-height: 1
}

/* ==========================================================
   TELEPHONE
   ========================================================== */

.no-results-phone {
    margin-top: 27px;

    color: rgba(255, 255, 255, 0.65);

    font-size: 14px
}

.no-results-phone a {
    margin-left: 5px;

    color: var(--nr-white);

    font-weight: 700;

    text-decoration: none
}

.no-results-phone a:hover {
    color: var(--nr-white);

    text-decoration: underline
}

/* ==========================================================
   TABLET
   2 CARDS PER ROW
   ========================================================== */

@media (max-width: 900px) {

    .no-results-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

}

/* ==========================================================
   MOBILE
   1 CARD PER ROW
   ========================================================== */

@media (max-width: 600px) {

    /* Hero */

    .no-results-hero {
        padding: 50px 18px
    }

    .no-results-hero h1 {
        letter-spacing: -0.8px
    }

    .no-results-intro {
        font-size: 16px
    }

    /* Tips */

    .no-results-tips {
        padding: 50px 18px;

        border-radius: 18px
    }

    .no-results-heading {
        margin-bottom: 30px
    }

    .no-results-grid {
        grid-template-columns: 1fr;

        gap: 14px
    }

    /* Cards */

    .no-results-card {
        gap: 14px;

        padding: 21px
    }

    .no-results-icon {
        flex-basis: 40px;

        width: 40px;
        height: 40px;

        font-size: 18px
    }

    /* Help CTA */

    .no-results-help {
        margin-top: 20px;

        padding: 50px 20px;

        border-radius: 18px
    }

    /* Buttons */

    .no-results-actions {
        flex-direction: column;

        width: 100%
    }

    .no-results-page .promise-button {
        width: 100%;

        box-sizing: border-box
    }

}

.cart-dropdown table td.price .content_value, .shopping-cart table td.total .content_value {
background: #e6f7f7
}

.catalog-single.has-carousel .rrp {
    display: none
}

/* ==========================================
   OFFICE SUPPLIES HERO + BENEFITS
========================================== */

.cos-os-top {
    width: 100%
}

/* ==========================================
   HERO
========================================== */

.cos-os-hero {
    position: relative;

    min-height: 520px;

    display: flex;
    align-items: center;

    overflow: hidden;

    background: #10231d
}

/* Hero image */

.cos-os-hero-image {
    position: absolute;
    inset: 0
}

.cos-os-hero-image img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover
}

/* Dark fade for readable text */

.cos-os-hero-image::after {
    content: "";

    position: absolute;
    inset: 0;

    background: linear-gradient(
        90deg,
        rgba(16,35,29,.94) 0%,
        rgba(16,35,29,.74) 38%,
        rgba(16,35,29,.22) 70%,
        rgba(16,35,29,.02) 100%
    )
}

/* Hero text */

.cos-os-hero-content {
    position: relative;
    z-index: 2;

    width: 90%;
    max-width: 1200px;

    margin: 0 auto;

    color: #fff
}

.cos-os-hero-content > span {
    display: inline-block;
    margin-bottom: 35px;
    padding: 7px 13px;
    background: #292c2ea1;
    border-left: 4px solid #008080;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .4px;
    text-transform: uppercase
}

.cos-os-hero-content h1 {
    max-width: 680px;

    margin: 0 0 20px;

    color: #fff;

    font-size: clamp(38px, 5vw, 50px);
    line-height: 1.05;
    font-weight: 800
}

.cos-os-hero-content p {
    max-width: 610px;

    margin: 0 0 28px;

    color: rgba(255,255,255,.92);

    font-size: 20px;
    line-height: 1.6
}

.cos-os-hero-content a {
    transition: color .25s ease, transform .25s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0 24px;
    border-radius: 4px;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
    background: #008080;
    color: #fff;
}

.cos-os-hero-content a:hover {
    background: #3dbbbb;
    color: #fff
}

/* ==========================================
   BENEFITS STRIP
========================================== */

.cos-os-benefits {
    display: grid;

    grid-template-columns: repeat(6, 1fr);

    gap: 1px;

    background: #dddddd;
    border-bottom: 1px solid #dddddd
}

.cos-os-benefit {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 24px 26px;
    justify-content: center;
    background: #f7f8f8
}

/* Benefit image */

.cos-benefit-img {
    width: 48px;
    height: 48px;
    min-width: 48px;

    display: block;

    object-fit: contain
}

/* Benefit text */

.cos-os-benefit strong {
    display: block;

    margin-bottom: 4px;

    color: #10231d;

    font-size: 15px;
    line-height: 1.3;
    font-weight: 700
}

.cos-os-benefit span {
    display: block;

    color: #6b7773;

    font-size: 13px;
    line-height: 1.4
}

/* ==========================================
   TABLET
========================================== */

@media (max-width: 1000px) {

    .cos-os-hero {
        min-height: 480px
    }

    .cos-os-hero-content h1 {
        font-size: 38px
    }

    .cos-os-benefits {
        grid-template-columns: repeat(3, 1fr)
    }

}

/* ==========================================
   OFFICE SUPPLIES - CATEGORY INTRO
========================================== */

.cos-os-category-intro {
    width: 100%;
    padding: 50px 5% 20px;
    background: #f7f8f8
}

/* Heading container */

.cos-os-heading {
    width: 100%;
    margin: 0
}

/* Main heading */

/* Intro text */

/* ==========================================
   TABLET
========================================== */

@media (max-width: 900px) {

    .cos-os-category-intro {
        padding: 60px 5% 28px
    }

    .cos-os-heading h2 {
        font-size: 36px
    }

}

/* ==========================================
   MOBILE
========================================== */

@media (max-width: 700px) {

    .cos-os-category-intro {
        padding: 48px 20px 24px
    }

    .cos-os-heading p {
        font-size: 14px;
        line-height: 1.55
    }

}

/* ==========================================
   COMMON SECTION HEADING
========================================== */

.cos-os-heading {
    width: 100%;

    margin: 0 0 35px
}

.cos-os-heading > span {
    display: inline-block;

    margin-bottom: 10px;

    color: #008080;

    font-size: 14px;
    line-height: 1.3;
    font-weight: 800;

    text-transform: uppercase;
    letter-spacing: .7px
}

.cos-os-heading h2 {
    margin: 0 0 12px;

    color: #10231d;

    font-size: 42px;
    line-height: 1.1;
    font-weight: 800;

    letter-spacing: -.5px
}

.cos-os-heading p {
    margin: 0;

    color: #4c5a55;

    font-size: 17px;
    line-height: 1.6
}

/* ==========================================
   EVERYDAY ESSENTIALS
========================================== */

.cos-os-feature-section {
    padding: 75px 5%;

    background: #f7f8f8
}

.cos-os-feature-grid {
    display: grid;

    grid-template-columns: 1.3fr 1fr 1fr;
    grid-template-rows: repeat(2, 260px);

    gap: 20px
}

.cos-os-feature-card {
    position: relative;

    display: block;

    overflow: hidden;

    border-radius: 12px;

    background: #10231d;

    text-decoration: none
}

.cos-os-feature-card img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transition: transform .35s ease
}

.cos-os-feature-card:hover img {
    transform: scale(1.045)
}

/* Large card */

.cos-os-feature-main {
    grid-column: 1;
    grid-row: 1 / span 2
}

/* Image overlay */

.cos-os-feature-overlay {
    position: absolute;
    inset: 0;

    display: flex;
    flex-direction: column;
    justify-content: flex-end;

    padding: 24px;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 50%, rgba(7, 20, 16, .80) 100%)
}

.cos-os-feature-overlay h3 {
    margin: 0 0 6px;

    color: #fff;

    font-size: 24px;
    line-height: 1.2;
    font-weight: 700;
    text-shadow: -1px 1px 2px #454545
}

.cos-os-feature-overlay p {
    max-width: 320px;

    margin: 0;

    color: rgba(255,255,255,.9);

    font-size: 14px;
    line-height: 1.45
}

/* Large image content */

.cos-os-feature-overlay-main {
    padding: 40px;

    display: flex;
    flex-direction: column;
    justify-content: flex-start
}

/* Small label - top */

.cos-os-feature-overlay-main > span {
width: fit-content;
    margin-bottom: 14px;
    display: inline-block;
    align-self: flex-start;
    padding: 8px 14px;
    background: #292c2ea1;
    border-left: 4px solid #008080;
    color: #fff;
    font-size: 13px;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .5px
}

/* Main heading - directly below label */

.cos-os-feature-overlay-main h3 {
    max-width: 500px;

    margin: 0;

    color: #fff;

    font-size: 40px;
    line-height: 1.1;
    font-weight: 700;
    text-shadow: -1px 1px 2px #454545
}

/* Description - pushed to bottom */

.cos-os-feature-overlay-main p {
    max-width: 450px;

    margin: auto 0 0;

    color: rgba(255,255,255,.92);

    font-size: 16px;
    line-height: 1.55
}

/* ==========================================
   BEST SELLERS
========================================== */

.cos-os-products {
    padding: 75px 5%;

    background: #ffffff
}

.cos-os-products-grid {
    display: grid;

    grid-template-columns: repeat(5, 1fr);

    gap: 18px
}

.cos-os-product-card {
    position: relative;

    overflow: hidden;

    border: 1px solid #e4ece9;
    border-radius: 12px;

    background: #ffffff;

    transition:
        transform .25s ease,
        box-shadow .25s ease,
        border-color .25s ease
}

.cos-os-product-card:hover {
    transform: translateY(-5px);

    border-color: #d6e2de;

    box-shadow: 0 14px 32px rgba(16,35,29,.10)
}

.cos-os-product-card > a:first-of-type {
    display: block;

    background: #f8f9f9
}

.cos-os-product-card img {
    width: 100%;

    display: block;

    aspect-ratio: 1 / 1;

    object-fit: contain;

    background: #ffffff
}

.cos-os-product-badge {
    position: absolute;
    z-index: 3;

    top: 14px;
    left: 14px;

    padding: 6px 10px;

    border-radius: 20px;

    background: #008080;

    color: #fff;

    font-size: 11px;
    line-height: 1.2;
    font-weight: 800;

    text-transform: uppercase;
    letter-spacing: .3px
}

.cos-os-product-content {
    padding: 20px
}

.cos-os-product-content h3 {
    margin: 0 0 8px;

    color: #10231d;

    font-size: 18px;
    line-height: 1.3;
    font-weight: 700
}

.cos-os-product-content p {
    min-height: 42px;

    margin: 0 0 16px;

    color: #687570;

    font-size: 13px;
    line-height: 1.5
}

.cos-os-product-content > a {
    color: #008080;

    font-size: 14px;
    line-height: 1.4;
    font-weight: 800;

    text-decoration: none;

    transition: color .25s ease
}

.cos-os-product-content > a:hover {
    color: #3dbbbb
}

/* ==========================================
   TRUSTED BRANDS
========================================== */

.cos-os-brands {
    padding: 70px 5%;

    background: #f7f8f8
}

.cos-os-brand-grid {
    display: grid;

    grid-template-columns: repeat(6, 1fr);

    gap: 15px
}

.cos-os-brand-grid > div {
    min-height: 110px;

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 20px;

    border: 1px solid #e3eae7;
    border-radius: 10px;

    background: #ffffff;

    transition:
        transform .25s ease,
        box-shadow .25s ease
}

.cos-os-brand-grid > div:hover {
    transform: translateY(-3px);

    box-shadow: 0 10px 24px rgba(16,35,29,.08)
}

.cos-os-brand-grid img {
    max-width: 130px;
    max-height: 55px;

    display: block;

    object-fit: contain
}

.cos-os-brand-copy p {
    margin: 0 0 22px;
    line-height: 1.75
}

.cos-os-brand-copy p:last-child {
    margin-bottom: 0
}

/* ==========================================
   BUSINESS CTA
========================================== */

.cos-os-cta {
    padding: 80px 5%;

    background: #008080
}

.cos-os-cta-inner {
    max-width: 850px;

    margin: 0 auto;

    text-align: center
}

.cos-os-cta-inner > span {
    display: block;

    margin-bottom: 12px;

    color: #b9eeee;

    font-size: 14px;
    line-height: 1.3;
    font-weight: 800;

    text-transform: uppercase;
    letter-spacing: .6px
}

.cos-os-cta h2 {
    margin: 0 0 16px;

    color: #fff;

    font-size: 44px;
    line-height: 1.1;
    font-weight: 800
}

.cos-os-cta p {
    max-width: 740px;

    margin: 0 auto 28px;

    color: rgba(255,255,255,.9);

    font-size: 17px;
    line-height: 1.6
}

.cos-os-cta-links {
    display: flex;
    align-items: center;
    justify-content: center;

    gap: 30px
}

.cos-os-cta-links a {
    color: #fff;

    font-size: 16px;
    line-height: 1.4;
    font-weight: 800;

    text-decoration: none;

    transition:
        color .25s ease,
        transform .25s ease
}

.cos-os-cta-links a:hover {
    color: #b9eeee;

    transform: translateX(3px)
}

/* Main Everyday Essentials image is not clickable */
.cos-os-feature-main {
    cursor: default
}

.cos-os-feature-main:hover img {
    transform: none
}

/* ==========================================
   LARGE TABLET
========================================== */

@media (max-width: 1100px) {

    .cos-os-products-grid {
        grid-template-columns: repeat(3, 1fr)
    }

    .cos-os-brand-grid {
        grid-template-columns: repeat(3, 1fr)
    }

    .cos-os-feature-grid {
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: auto
    }

    .cos-os-feature-card {
        height: 250px
    }

    .cos-os-feature-main {
        grid-column: 1 / -1;
        grid-row: auto;

        height: 420px
    }

}

/* ==========================================
   TABLET
========================================== */

@media (max-width: 850px) {

    .cos-os-heading h2 {
        font-size: 36px
    }

    .cos-os-products-grid {
        grid-template-columns: repeat(2, 1fr)
    }

}

/* ==========================================
   MOBILE
========================================== */

@media (max-width: 700px) {

    .cos-os-feature-section,
    .cos-os-products,
    .cos-os-brands {
        padding: 55px 20px
    }

    .cos-os-heading {
        margin-bottom: 28px
    }

    .cos-os-heading > span {
        font-size: 13px
    }

    .cos-os-heading h2 {
        font-size: 32px;
        line-height: 1.15
    }

    .cos-os-heading p {
        font-size: 15px;
        line-height: 1.55
    }

    /* Feature cards */

    .cos-os-feature-grid {
        grid-template-columns: 1fr
    }

    .cos-os-feature-card,
    .cos-os-feature-main {
        height: 270px
    }

    .cos-os-feature-overlay-main {
        padding: 26px
    }

    .cos-os-feature-overlay-main h3 {
        font-size: 30px
    }

    /* Products */

    .cos-os-products-grid {
        grid-template-columns: 1fr
    }

    .cos-os-product-content p {
        min-height: 0
    }

    /* Brands */

    .cos-os-brand-grid {
        grid-template-columns: repeat(2, 1fr);

        gap: 10px
    }

    /* CTA */

    .cos-os-cta {
        padding: 65px 20px
    }

    .cos-os-cta h2 {
        font-size: 34px
    }

    .cos-os-cta p {
        font-size: 15px
    }

    .cos-os-cta-links {
        flex-direction: column;

        gap: 14px
    }

}

.cos-os-intro-lead {
    max-width: 900px !important;

    margin-bottom: 24px !important;

    color: #4c5a55;

    font-size: 18px !important;
    line-height: 1.6 !important;
    font-weight: 500
}

.cos-os-intro-copy {
   padding-top: 22px;
   border-top: 1px solid #e3e9e7
}

.cos-os-intro-copy p {
    margin: 0 0 14px;

    color: #687570;

    font-size: 16px;
    line-height: 1.75
}

.cos-os-intro-copy p:last-child {
    margin-bottom: 0
}

.cos-os-intro-copy strong {
    color: #10231d;
    font-weight: 700
}

@media (max-width: 700px) {

    .cos-os-intro-lead {
        margin-bottom: 20px !important;

        font-size: 16px !important
    }

    .cos-os-intro-copy {
        padding-top: 18px
    }

    .cos-os-intro-copy p {
        font-size: 14px;
        line-height: 1.7
    }

}

.cat-tiles a p {
    line-height: 1.5;
    margin-bottom: 0;
    margin-top: 8px;
    text-align: left;
    font-weight: 700;
    margin-left: 5px
}

.cat-tiles a p:after {
    content: "View Our Range >";
    display: block;
    font-size: 12px;
    font-weight: 400
}

/* ===================================
   COUNTY OFFICE MOBILE NAVIGATION
=================================== */

.countyOX-mobileBaner {
  position: relative;
  width: 100%;
  background: #008080;
  overflow: hidden
}

/* Horizontal scrolling menu */

.cos-mobile-nav {
  position: relative;
  width: 100%
}

.cos-mobile-nav__list {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 26px;

  margin: 0;
  padding: 0 18px;

  list-style: none;
  white-space: nowrap;

  overflow-x: auto;
  overflow-y: hidden;

  scrollbar-width: none;
  scroll-behavior: smooth
}

/* Hide scrollbar */

.cos-mobile-nav__list::-webkit-scrollbar {
  display: none
}

/* Menu items */

.cos-mobile-nav__list li {
  flex: 0 0 auto;
  margin: 0;
  padding: 0
}

/* Menu links */

.cos-mobile-nav__list a {
  position: relative;
  display: block;

  padding: 15px 0 16px;

  color: #fff;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none;

  transition: color .2s ease
}

/* Underline */

.cos-mobile-nav__list a::after {
  content: "";
  position: absolute;

  bottom: 7px;
  left: 0;

  width: 100%;
  height: 2px;

  background: #ffffff;
  border-radius: 2px;

  transform: scaleX(0);
  transform-origin: center;
  transition: transform .25s ease
}

/* Hover and active underline */

.cos-mobile-nav__list a:hover::after,
.cos-mobile-nav__list a.active::after,
.cos-mobile-nav__list a[aria-current="page"]::after {
  transform: scaleX(1)
}

/* Active text */

.cos-mobile-nav__list a.active,
.cos-mobile-nav__list a[aria-current="page"] {
  color: #fff
}

/* Subtle right fade */

.cos-mobile-nav::after {
  content: "";
  position: absolute;

  right: 0;
  top: 0;
  bottom: 0;

  width: 25px;

  background: linear-gradient(
    to right,
    transparent,
    #008080
  );

  pointer-events: none
}

/* Smaller mobile screens */

@media (max-width: 480px) {
  .cos-mobile-nav__list {
    gap: 22px;
    padding: 0 15px
  }

  .cos-mobile-nav__list a {
    font-size: 13px;
    padding: 14px 0 15px
  }
}

div#htmlcontent_116140 {
    background: #008080
}

/* ========================================
   COS - OFFICE DESKS CATEGORY NAVIGATION
======================================== */

.cos-desk-nav {
padding: 28px 20px;
    background: #e6f7f7;
    border: 1px solid #dceeee;
    font-family: inherit;
    border-radius: 10px;
    margin: 0 5px 15px
}

.cos-desk-nav * {
  box-sizing: border-box
}

.cos-desk-nav__inner {
  max-width: 1400px;
  margin: 0 auto
}

/* Heading */

.cos-desk-nav__heading {
  margin-bottom: 20px
}

.cos-desk-nav__eyebrow {
  display: block;
  margin-bottom: 6px;
  color: #008080;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-transform: uppercase
}

.cos-desk-nav__heading h2 {
  margin: 0 0 6px;
  color: #173e3e;
  font-size: 25px;
  font-weight: 700;
  line-height: 1.25
}

.cos-desk-nav__heading p {
  margin: 0;
  color: #617474;
  font-size: 14px;
  line-height: 1.6
}

/* Desktop - 4 columns, 2 rows */

.cos-desk-nav__links {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px
}

.cos-desk-nav__links a {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 0;
  padding: 17px 12px;
  background: #ffffff;
  border: 1px solid #c6e5e5;
  border-radius: 8px;
  color: #008080;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  transition:
    background .2s ease,
    border-color .2s ease,
    box-shadow .2s ease,
    transform .2s ease
}

/* Arrow directly beside text */

.cos-desk-nav__links a span {
  display: inline-block;
  flex-shrink: 0;
  color: #008080;
  font-size: 18px;
  line-height: 1;
  transition: transform .2s ease
}

/* Hover */

.cos-desk-nav__links a:hover {
  background: #ffffff;
  border-color: #3dbbbb;
  color: #066;
  box-shadow: 0 4px 14px rgba(0, 128, 128, 0.08);
  transform: translateY(-2px)
}

.cos-desk-nav__links a:hover span {
  transform: translateX(3px)
}

.cos-desk-nav__links a:focus-visible {
  outline: 3px solid #008080;
  outline-offset: 3px
}

/* Tablet - 2 columns */

@media (max-width: 900px) {
  .cos-desk-nav__links {
    grid-template-columns: repeat(2, minmax(0, 1fr))
  }
}

/* Mobile - horizontal swipe */

@media (max-width: 600px) {

  .cos-desk-nav {
    padding: 22px 0
  }

  .cos-desk-nav__heading {
    padding: 0 16px;
    margin-bottom: 16px
  }

  .cos-desk-nav__heading h2 {
    font-size: 21px
  }

  .cos-desk-nav__heading p {
    font-size: 13px
  }

  .cos-desk-nav__links {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    padding: 2px 16px 12px;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none
  }

  .cos-desk-nav__links::-webkit-scrollbar {
    display: none
  }

  .cos-desk-nav__links a {
    flex: 0 0 185px;
    min-height: 60px;
    padding: 13px 14px;
    scroll-snap-align: start;
    font-size: 13px
  }

  .cos-desk-nav__links a:hover {
    transform: none
  }
}

/* Accessibility */

@media (prefers-reduced-motion: reduce) {
  .cos-desk-nav__links a,
  .cos-desk-nav__links a span {
    transition: none
  }
}

.ex-content-page .gridtools .listgrid, .ex-content-page .gridtools .filterby, .ex-category .gridtools .listgrid, .ex-category .gridtools .filterby, .ex-searchresult .gridtools .listgrid, .ex-searchresult .gridtools .filterby {
    border: 0;
    display: inline-flex;
    gap: 10px
}

.listtools .listgrid {
display: none!Important
}

.ex-category .gridtools .listgrid {
    display: none
}

/* ==========================================
   CANTEEN CHAIRS NAVIGATION
========================================== */

/* Three equal-width columns on desktop */
@media (min-width: 901px) {
    .cos-canteen-nav .cos-desk-nav__links {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }
}

/* Two columns on tablet - inherited */

/* Swipeable navigation on mobile - inherited */

    .cos-reception-nav .cos-desk-nav__links {
        display: flex;
        flex-wrap: nowrap;
        gap: 10px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 2px 2px 10px;
        scrollbar-width: thin
    }

    .cos-reception-nav .cos-desk-nav__links a {
        flex: 0 0 auto;
        min-width: 155px;
        padding: 13px 16px;
        scroll-snap-align: start;
        font-size: 13px
    }

}

/* ==========================================
   RECEPTION DESKS CATEGORY NAVIGATION
========================================== */

.cos-desk-nav {
    padding: 28px 20px;
    background: #e6f7f7;
    border: 1px solid #dceeee;
    font-family: inherit;
    border-radius: 10px;
    margin: 0 5px 15px
}

/* HEADING */

.cos-desk-nav__heading {
    text-align: center;
    margin-bottom: 22px
}

.cos-desk-nav__heading > span {
    display: block;
    color: #008080;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 8px
}

.cos-desk-nav__heading h2 {
    font-size: 26px;
    font-weight: 700;
    line-height: 1.3;
    margin: 0 0 10px
}

.cos-desk-nav__heading p {
    max-width: 760px;
    margin: 0 auto;
    font-size: 15px;
    line-height: 1.6;
    color: #555
}

/* NAVIGATION LINKS */

.cos-reception-nav .cos-desk-nav__links {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px
}

.cos-reception-nav .cos-desk-nav__links a {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 0;
    padding: 15px 12px;
    border: 1px solid #dceeee;
    border-radius: 8px;
    background: #ffffff;
    color: #263b3b;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.3;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    transition: all .2s ease
}

/* ARROWS */

.cos-reception-nav .cos-desk-nav__links a span {
    color: #008080;
    font-size: 19px;
    line-height: 1;
    flex-shrink: 0;
    transition: transform .2s ease
}

/* HOVER */

.cos-reception-nav .cos-desk-nav__links a:hover {
    background: #ffffff;
    border-color: #008080;
    color: #008080
}

.cos-reception-nav .cos-desk-nav__links a:hover span {
    transform: translateX(3px)
}

/* KEYBOARD ACCESSIBILITY */

.cos-reception-nav .cos-desk-nav__links a:focus-visible {
    outline: 2px solid #008080;
    outline-offset: 3px
}

/* TABLET */

@media (max-width: 900px) and (min-width: 601px) {

    .cos-reception-nav .cos-desk-nav__links {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

}

/* MOBILE - SWIPEABLE NAVIGATION */

@media (max-width: 600px) {

    .cos-reception-nav {
        padding: 22px 15px
    }

    .cos-reception-nav .cos-desk-nav__heading h2 {
        font-size: 22px
    }

    .cos-reception-nav .cos-desk-nav__heading p {
        font-size: 14px
    }

    .cos-reception-nav .cos-desk-nav__links {
        display: flex;
        flex-wrap: nowrap;
        gap: 10px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 2px 2px 10px;
        scrollbar-width: thin
    }
}

/* Reception Desks - 3-column desktop layout */

@media (min-width: 901px) {
    .cos-reception-nav .cos-desk-nav__links {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }
}

/* ==========================================
   PEDESTALS CATEGORY NAVIGATION
========================================== */

/* Desktop - Four equal-width columns */
@media (min-width: 901px) {

    .cos-pedestal-nav .cos-desk-nav__links {
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }

}

/* Tablet - Two columns */
@media (min-width: 601px) and (max-width: 900px) {

    .cos-pedestal-nav .cos-desk-nav__links {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

}

/* Mobile - Swipeable navigation */
@media (max-width: 600px) {

    .cos-pedestal-nav .cos-desk-nav__links {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        gap: 10px;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 2px 2px 10px;
        scrollbar-width: thin
    }

    .cos-pedestal-nav .cos-desk-nav__links a {
        flex: 0 0 auto;
        min-width: 155px;
        scroll-snap-align: start
    }

}

/* ==========================================
   OFFICE CHAIRS CATEGORY NAVIGATION
========================================== */

/* DESKTOP - FOUR COLUMNS */

@media (min-width: 901px) {

    .cos-chair-nav .cos-desk-nav__links {
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }

}

/* TABLET - TWO COLUMNS */

@media (min-width: 601px) and (max-width: 900px) {

    .cos-chair-nav .cos-desk-nav__links {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

}

/* MOBILE - SWIPEABLE NAVIGATION */

@media (max-width: 600px) {

    .cos-chair-nav .cos-desk-nav__links {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        gap: 10px;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 2px 2px 10px;
        scrollbar-width: thin
    }

    .cos-chair-nav .cos-desk-nav__links a {
        flex: 0 0 auto;
        min-width: 155px;
        scroll-snap-align: start
    }

}

/* ==========================================
   VISITORS CHAIRS CATEGORY NAVIGATION
========================================== */

/* DESKTOP - THREE COLUMNS */

@media (min-width: 901px) {

    .cos-visitor-nav .cos-desk-nav__links {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

}

/* TABLET - TWO COLUMNS */

@media (min-width: 601px) and (max-width: 900px) {

    .cos-visitor-nav .cos-desk-nav__links {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

}

/* MOBILE - SWIPEABLE NAVIGATION */

@media (max-width: 600px) {

    .cos-visitor-nav .cos-desk-nav__links {
        display: flex;
        flex-wrap: nowrap;
        gap: 10px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 2px 2px 10px;
        scrollbar-width: thin
    }

    .cos-visitor-nav .cos-desk-nav__links a {
        flex: 0 0 auto;
        min-width: 155px;
        scroll-snap-align: start
    }

}

/* ==========================================
   RECEPTION CHAIRS CATEGORY NAVIGATION
========================================== */

/* DESKTOP - THREE COLUMNS */

@media (min-width: 901px) {

    .cos-reception-chair-nav .cos-desk-nav__links {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

}

/* TABLET - TWO COLUMNS */

@media (min-width: 601px) and (max-width: 900px) {

    .cos-reception-chair-nav .cos-desk-nav__links {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

}

/* MOBILE - SWIPEABLE NAVIGATION */

@media (max-width: 600px) {

    .cos-reception-chair-nav .cos-desk-nav__links {
        display: flex;
        flex-wrap: nowrap;
        gap: 10px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 2px 2px 10px;
        scrollbar-width: thin
    }

    .cos-reception-chair-nav .cos-desk-nav__links a {
        flex: 0 0 auto;
        min-width: 175px;
        scroll-snap-align: start
    }

}

/* ==========================================
   CONFERENCE CHAIRS CATEGORY NAVIGATION
========================================== */

/* DESKTOP - FOUR COLUMNS */

@media (min-width: 901px) {

    .cos-conference-nav .cos-desk-nav__links {
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }

}

/* TABLET - TWO COLUMNS */

@media (min-width: 601px) and (max-width: 900px) {

    .cos-conference-nav .cos-desk-nav__links {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

}

/* MOBILE - SWIPEABLE NAVIGATION */

@media (max-width: 600px) {

    .cos-conference-nav .cos-desk-nav__links {
        display: flex;
        flex-wrap: nowrap;
        gap: 10px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 2px 2px 10px;
        scrollbar-width: thin
    }

    .cos-conference-nav .cos-desk-nav__links a {
        flex: 0 0 auto;
        min-width: 160px;
        scroll-snap-align: start
    }

}

/* ==========================================
   MEETING BOOTHS CATEGORY NAVIGATION
========================================== */

/* DESKTOP - THREE COLUMNS */

@media (min-width: 901px) {

    .cos-meeting-booth-nav .cos-desk-nav__links {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

}

/* TABLET - TWO COLUMNS */

@media (min-width: 601px) and (max-width: 900px) {

    .cos-meeting-booth-nav .cos-desk-nav__links {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

}

/* MOBILE - SWIPEABLE NAVIGATION */

@media (max-width: 600px) {

    .cos-meeting-booth-nav .cos-desk-nav__links {
        display: flex;
        flex-wrap: nowrap;
        gap: 10px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 2px 2px 10px;
        scrollbar-width: thin
    }

    .cos-meeting-booth-nav .cos-desk-nav__links a {
        flex: 0 0 auto;
        min-width: 190px;
        scroll-snap-align: start
    }

}

/* ==========================================
   BOOKCASES CATEGORY NAVIGATION
========================================== */

/* DESKTOP - THREE COLUMNS */

@media (min-width: 901px) {

    .cos-bookcase-nav .cos-desk-nav__links {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

}

/* TABLET - TWO COLUMNS */

@media (min-width: 601px) and (max-width: 900px) {

    .cos-bookcase-nav .cos-desk-nav__links {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

}

/* MOBILE - SWIPEABLE NAVIGATION */

@media (max-width: 600px) {

    .cos-bookcase-nav .cos-desk-nav__links {
        display: flex;
        flex-wrap: nowrap;
        gap: 10px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 2px 2px 10px;
        scrollbar-width: thin
    }

    .cos-bookcase-nav .cos-desk-nav__links a {
        flex: 0 0 auto;
        min-width: 180px;
        scroll-snap-align: start
    }

}

/* ==========================================
   BOOKCASE COMBINATIONS CATEGORY NAVIGATION
========================================== */

/* DESKTOP - THREE COLUMNS */

@media (min-width: 901px) {

    .cos-bookcase-combo-nav .cos-desk-nav__links {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

}

/* TABLET - TWO COLUMNS */

@media (min-width: 601px) and (max-width: 900px) {

    .cos-bookcase-combo-nav .cos-desk-nav__links {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

}

/* MOBILE - SWIPEABLE NAVIGATION */

@media (max-width: 600px) {

    .cos-bookcase-combo-nav .cos-desk-nav__links {
        display: flex;
        flex-wrap: nowrap;
        gap: 10px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 2px 2px 10px;
        scrollbar-width: thin
    }

    .cos-bookcase-combo-nav .cos-desk-nav__links a {
        flex: 0 0 auto;
        min-width: 180px;
        scroll-snap-align: start
    }

}

/* ==========================================
   OFFICE CUPBOARDS CATEGORY NAVIGATION
========================================== */

/* DESKTOP - THREE COLUMNS */

@media (min-width: 901px) {

    .cos-cupboard-nav .cos-desk-nav__links {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

}

/* TABLET - TWO COLUMNS */

@media (min-width: 601px) and (max-width: 900px) {

    .cos-cupboard-nav .cos-desk-nav__links {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

}

/* MOBILE - SWIPEABLE NAVIGATION */

@media (max-width: 600px) {

    .cos-cupboard-nav .cos-desk-nav__links {
        display: flex;
        flex-wrap: nowrap;
        gap: 10px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 2px 2px 10px;
        scrollbar-width: thin
    }

    .cos-cupboard-nav .cos-desk-nav__links a {
        flex: 0 0 auto;
        min-width: 190px;
        scroll-snap-align: start
    }

}

/* ==========================================
   FILING CABINETS CATEGORY NAVIGATION
========================================== */

/* DESKTOP - FOUR COLUMNS */

@media (min-width: 901px) {

    .cos-filing-nav .cos-desk-nav__links {
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }

}

/* TABLET - TWO COLUMNS */

@media (min-width: 601px) and (max-width: 900px) {

    .cos-filing-nav .cos-desk-nav__links {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

}

/* MOBILE - SWIPEABLE NAVIGATION */

@media (max-width: 600px) {

    .cos-filing-nav .cos-desk-nav__links {
        display: flex;
        flex-wrap: nowrap;
        gap: 10px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 2px 2px 10px;
        scrollbar-width: thin
    }

    .cos-filing-nav .cos-desk-nav__links a {
        flex: 0 0 auto;
        min-width: 175px;
        scroll-snap-align: start
    }

}

/* ==========================================
   LOCKERS CATEGORY NAVIGATION
========================================== */

/* DESKTOP - THREE COLUMNS */

@media (min-width: 901px) {

    .cos-locker-nav .cos-desk-nav__links {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

}

/* TABLET - TWO COLUMNS */

@media (min-width: 601px) and (max-width: 900px) {

    .cos-locker-nav .cos-desk-nav__links {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

}

/* MOBILE - SWIPEABLE NAVIGATION */

@media (max-width: 600px) {

    .cos-locker-nav .cos-desk-nav__links {
        display: flex;
        flex-wrap: nowrap;
        gap: 10px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 2px 2px 10px;
        scrollbar-width: thin
    }

    .cos-locker-nav .cos-desk-nav__links a {
        flex: 0 0 auto;
        min-width: 175px;
        scroll-snap-align: start
    }

}

/* ==========================================
   MULTIDRAWER CABINETS CATEGORY NAVIGATION
========================================== */

/* DESKTOP - THREE COLUMNS */

@media (min-width: 901px) {

    .cos-multidrawer-nav .cos-desk-nav__links {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

}

/* TABLET - TWO COLUMNS */

@media (min-width: 601px) and (max-width: 900px) {

    .cos-multidrawer-nav .cos-desk-nav__links {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

}

/* MOBILE - SWIPEABLE NAVIGATION */

@media (max-width: 600px) {

    .cos-multidrawer-nav .cos-desk-nav__links {
        display: flex;
        flex-wrap: nowrap;
        gap: 10px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 2px 2px 10px;
        scrollbar-width: thin
    }

    .cos-multidrawer-nav .cos-desk-nav__links a {
        flex: 0 0 auto;
        min-width: 175px;
        scroll-snap-align: start
    }

}

/* ==========================================
   PEDESTALS (2) CATEGORY NAVIGATION
========================================== */

/* DESKTOP - FOUR COLUMNS */

@media (min-width: 901px) {

    .cos-pedestals-two-nav .cos-desk-nav__links {
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }

}

/* TABLET - TWO COLUMNS */

@media (min-width: 601px) and (max-width: 900px) {

    .cos-pedestals-two-nav .cos-desk-nav__links {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

}

/* MOBILE - SWIPEABLE NAVIGATION */

@media (max-width: 600px) {

    .cos-pedestals-two-nav .cos-desk-nav__links {
        display: flex;
        flex-wrap: nowrap;
        gap: 10px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 2px 2px 10px;
        scrollbar-width: thin
    }

    .cos-pedestals-two-nav .cos-desk-nav__links a {
        flex: 0 0 auto;
        min-width: 185px;
        scroll-snap-align: start
    }

}

/* ==========================================
   BOARDROOM TABLES CATEGORY NAVIGATION
========================================== */

/* DESKTOP - THREE COLUMNS */

@media (min-width: 901px) {

    .cos-boardroom-nav .cos-desk-nav__links {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

}

/* TABLET - TWO COLUMNS */

@media (min-width: 601px) and (max-width: 900px) {

    .cos-boardroom-nav .cos-desk-nav__links {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

}

/* MOBILE - SWIPEABLE NAVIGATION */

@media (max-width: 600px) {

    .cos-boardroom-nav .cos-desk-nav__links {
        display: flex;
        flex-wrap: nowrap;
        gap: 10px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 2px 2px 10px;
        scrollbar-width: thin
    }

    .cos-boardroom-nav .cos-desk-nav__links a {
        flex: 0 0 auto;
        min-width: 185px;
        scroll-snap-align: start
    }

}

/* ==========================================
   CANTEEN TABLES CATEGORY NAVIGATION
========================================== */

/* DESKTOP - FOUR COLUMNS */

@media (min-width: 901px) {

    .cos-canteen-table-nav .cos-desk-nav__links {
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }

}

/* TABLET - TWO COLUMNS */

@media (min-width: 601px) and (max-width: 900px) {

    .cos-canteen-table-nav .cos-desk-nav__links {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

}

/* MOBILE - SWIPEABLE NAVIGATION */

@media (max-width: 600px) {

    .cos-canteen-table-nav .cos-desk-nav__links {
        display: flex;
        flex-wrap: nowrap;
        gap: 10px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 2px 2px 10px;
        scrollbar-width: thin
    }

    .cos-canteen-table-nav .cos-desk-nav__links a {
        flex: 0 0 auto;
        min-width: 185px;
        scroll-snap-align: start
    }

}

/* ==========================================
   MEETING TABLES CATEGORY NAVIGATION
========================================== */

/* DESKTOP - THREE COLUMNS */

@media (min-width: 901px) {

    .cos-meeting-table-nav .cos-desk-nav__links {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

}

/* TABLET - TWO COLUMNS */

@media (min-width: 601px) and (max-width: 900px) {

    .cos-meeting-table-nav .cos-desk-nav__links {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

}

/* MOBILE - SWIPEABLE NAVIGATION */

@media (max-width: 600px) {

    .cos-meeting-table-nav .cos-desk-nav__links {
        display: flex;
        flex-wrap: nowrap;
        gap: 10px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 2px 2px 10px;
        scrollbar-width: thin
    }

    .cos-meeting-table-nav .cos-desk-nav__links a {
        flex: 0 0 auto;
        min-width: 185px;
        scroll-snap-align: start
    }

}

/* ==========================================
   RECEPTION TABLES CATEGORY NAVIGATION
========================================== */

/* DESKTOP - FOUR COLUMNS */

@media (min-width: 901px) {

    .cos-reception-table-nav .cos-desk-nav__links {
        grid-template-columns: repeat(4, minmax(0, 1fr))
    }

}

/* TABLET - TWO COLUMNS */

@media (min-width: 601px) and (max-width: 900px) {

    .cos-reception-table-nav .cos-desk-nav__links {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

}

/* MOBILE - SWIPEABLE NAVIGATION */

@media (max-width: 600px) {

    .cos-reception-table-nav .cos-desk-nav__links {
        display: flex;
        flex-wrap: nowrap;
        gap: 10px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 2px 2px 10px;
        scrollbar-width: thin
    }

    .cos-reception-table-nav .cos-desk-nav__links a {
        flex: 0 0 auto;
        min-width: 185px;
        scroll-snap-align: start
    }

}

/* ==========================================
   ACOUSTIC SCREENS CATEGORY NAVIGATION
========================================== */

/* DESKTOP - THREE COLUMNS */

@media (min-width: 901px) {

    .cos-acoustic-nav .cos-desk-nav__links {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

}

/* TABLET - TWO COLUMNS */

@media (min-width: 601px) and (max-width: 900px) {

    .cos-acoustic-nav .cos-desk-nav__links {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

}

/* MOBILE - SWIPEABLE NAVIGATION */

@media (max-width: 600px) {

    .cos-acoustic-nav .cos-desk-nav__links {
        display: flex;
        flex-wrap: nowrap;
        gap: 10px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 2px 2px 10px;
        scrollbar-width: thin
    }

    .cos-acoustic-nav .cos-desk-nav__links a {
        flex: 0 0 auto;
        min-width: 185px;
        scroll-snap-align: start
    }

}

/* ==========================================
   FLOOR STANDING SCREENS CATEGORY NAVIGATION
========================================== */

/* DESKTOP - THREE COLUMNS */

@media (min-width: 901px) {

    .cos-floor-screen-nav .cos-desk-nav__links {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

}

/* TABLET - TWO COLUMNS */

@media (min-width: 601px) and (max-width: 900px) {

    .cos-floor-screen-nav .cos-desk-nav__links {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

}

/* MOBILE - SWIPEABLE NAVIGATION */

@media (max-width: 600px) {

    .cos-floor-screen-nav .cos-desk-nav__links {
        display: flex;
        flex-wrap: nowrap;
        gap: 10px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 2px 2px 10px;
        scrollbar-width: thin
    }

    .cos-floor-screen-nav .cos-desk-nav__links a {
        flex: 0 0 auto;
        min-width: 185px;
        scroll-snap-align: start
    }

}

/* ==========================================
   DESK MOUNTED SCREENS CATEGORY NAVIGATION
========================================== */

/* DESKTOP - THREE COLUMNS */

@media (min-width: 901px) {

    .cos-desk-screen-nav .cos-desk-nav__links {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

}

/* TABLET - TWO COLUMNS */

@media (min-width: 601px) and (max-width: 900px) {

    .cos-desk-screen-nav .cos-desk-nav__links {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

}

/* MOBILE - SWIPEABLE NAVIGATION */

@media (max-width: 600px) {

    .cos-desk-screen-nav .cos-desk-nav__links {
        display: flex;
        flex-wrap: nowrap;
        gap: 10px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 2px 2px 10px;
        scrollbar-width: thin
    }

    .cos-desk-screen-nav .cos-desk-nav__links a {
        flex: 0 0 auto;
        min-width: 185px;
        scroll-snap-align: start
    }

}

/* ==========================================
   MEETING BOOTHS (2) CATEGORY NAVIGATION
========================================== */

/* DESKTOP - THREE COLUMNS */

@media (min-width: 901px) {

    .cos-meeting-booths-two-nav .cos-desk-nav__links {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

}

/* TABLET - TWO COLUMNS */

@media (min-width: 601px) and (max-width: 900px) {

    .cos-meeting-booths-two-nav .cos-desk-nav__links {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

}

/* MOBILE - SWIPEABLE NAVIGATION */

@media (max-width: 600px) {

    .cos-meeting-booths-two-nav .cos-desk-nav__links {
        display: flex;
        flex-wrap: nowrap;
        gap: 10px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 2px 2px 10px;
        scrollbar-width: thin
    }

    .cos-meeting-booths-two-nav .cos-desk-nav__links a {
        flex: 0 0 auto;
        min-width: 185px;
        scroll-snap-align: start
    }

}

/* ==========================================
   SOFT SEATING COLLECTION CATEGORY NAVIGATION
========================================== */

/* DESKTOP - THREE COLUMNS */

@media (min-width: 901px) {

    .cos-soft-seating-nav .cos-desk-nav__links {
        grid-template-columns: repeat(3, minmax(0, 1fr))
    }

}

/* TABLET - TWO COLUMNS */

@media (min-width: 601px) and (max-width: 900px) {

    .cos-soft-seating-nav .cos-desk-nav__links {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

}

/* MOBILE - SWIPEABLE NAVIGATION */

@media (max-width: 600px) {

    .cos-soft-seating-nav .cos-desk-nav__links {
        display: flex;
        flex-wrap: nowrap;
        gap: 10px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        padding: 2px 2px 10px;
        scrollbar-width: thin
    }

    .cos-soft-seating-nav .cos-desk-nav__links a {
        flex: 0 0 auto;
        min-width: 185px;
        scroll-snap-align: start
    }

}

/* ==========================================
   OFFICE FURNITURE CATEGORY HERO
   MOBILE OPTIMISATION
========================================== */

@media (max-width: 700px) {

    /* HERO CONTAINER */
    .cos-os-hero {
        min-height: 0;
        height: auto;
        padding: 30px 0;
        align-items: center
    }

    /* HERO IMAGE */
    .cos-os-hero-image img {
        object-fit: cover;
        object-position: center
    }

    /* STRONGER MOBILE OVERLAY */
    .cos-os-hero-image::after {
        background: linear-gradient(
            90deg,
            rgba(16,35,29,.92) 0%,
            rgba(16,35,29,.78) 55%,
            rgba(16,35,29,.48) 100%
        )
    }

    /* HERO CONTENT */
    .cos-os-hero-content {
        width: calc(100% - 40px);
        max-width: 100%;
        margin: 0 auto
    }

    /* SMALL HEADING */
    .cos-os-hero-content > span {
        font-size: 11px;
        line-height: 1.3;
        letter-spacing: .5px;
        padding: 6px 10px;
        margin-bottom: 12px
    }

    /* MAIN HEADING */
    .cos-os-hero-content h1 {
        max-width: 100%;
        font-size: 28px;
        line-height: 1.15;
        font-weight: 800;
        margin: 0 0 14px
    }

    /* DESCRIPTION */
    .cos-os-hero-content p {
        max-width: 100%;
        font-size: 14px;
        line-height: 1.5;
        margin: 0
    }

    /* HIDE BUSINESS ACCOUNT BUTTON */
    .cos-os-hero-content a {
        display: none
    }

    /* ======================================
       BENEFITS - TWO COLUMN GRID
    ====================================== */

    .cos-os-benefits {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 1px
    }

    /* INDIVIDUAL BENEFITS */
    .cos-os-benefit {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        gap: 8px;
        padding: 12px 10px;
        min-width: 0
    }

    /* BENEFIT ICONS */
    .cos-benefit-img {
        width: 30px;
        height: 30px;
        min-width: 30px;
        object-fit: contain
    }

    /* BENEFIT TEXT */
    .cos-os-benefit strong {
        font-size: 12px;
        line-height: 1.25;
        margin-bottom: 3px
    }

    .cos-os-benefit span {
        font-size: 11px;
        line-height: 1.3
    }

}

/* ==========================================
   SMALL MOBILE - UP TO 480PX
========================================== */

@media (max-width: 480px) {

    .cos-os-hero {
        padding: 26px 0
    }

    .cos-os-hero-content {
        width: calc(100% - 32px)
    }

    .cos-os-hero-content h1 {
        font-size: 26px;
        line-height: 1.15
    }

    .cos-os-hero-content p {
        font-size: 13px;
        line-height: 1.5
    }

    .cos-os-benefit {
        padding: 10px 8px;
        gap: 7px
    }

    .cos-benefit-img {
        width: 28px;
        height: 28px;
        min-width: 28px
    }

    .cos-os-benefit strong {
        font-size: 11px
    }

    .cos-os-benefit span {
        font-size: 10px
    }

}

/* ==========================================
   EVO CATEGORY DESCRIPTION - MOBILE READ MORE
========================================== */

/* DESKTOP - NO CHANGES */

/* MOBILE ONLY */
@media (max-width: 700px) {

    .catalog-content.cos-catalog-collapsible {
        position: relative
    }

    /* Description wrapper */
    .catalog-content .cos-catalog-text {
        max-height: 115px;
        overflow: hidden;
        position: relative
    }

    /* Fade at bottom of collapsed description */
    .catalog-content.cos-catalog-collapsible:not(.cos-expanded)
    .cos-catalog-text::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        height: 40px;
        pointer-events: none;
        background: linear-gradient(
            to bottom,
            rgba(255,255,255,0),
            #ffffff
        )
    }

    /* Expanded description */
    .catalog-content.cos-expanded .cos-catalog-text {
        max-height: none;
        overflow: visible
    }

    /* Read More button */
    .cos-catalog-toggle {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        margin-top: 12px;
        padding: 8px 0;
        border: none;
        background: transparent;
        color: #008080;
        font-size: 14px;
        font-weight: 700;
        cursor: pointer
    }

    .cos-catalog-toggle:hover {
        color: #3dbbbb
    }

}

/* DESKTOP - HIDE TOGGLE */
@media (min-width: 701px) {

    .cos-catalog-toggle {
        display: none !important
    }

    .catalog-content .cos-catalog-text {
        max-height: none !important;
        overflow: visible !important
    }

}

/* ==========================================
   COS INTRO COPY - MOBILE READ MORE
========================================== */

@media (max-width: 700px) {

    /* Collapsible intro content */
    .cos-os-intro-copy.cos-intro-collapsible
    .cos-intro-text {
        max-height: 120px;
        overflow: hidden;
        position: relative
    }

    /* Fade at bottom of collapsed text */
    .cos-os-intro-copy.cos-intro-collapsible:not(.cos-intro-expanded)
    .cos-intro-text::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        height: 35px;
        background: linear-gradient(
            to bottom,
            rgba(255,255,255,0),
            #ffffff
        );
        pointer-events: none
    }

    /* Expanded content */
    .cos-os-intro-copy.cos-intro-expanded
    .cos-intro-text {
        max-height: none;
        overflow: visible
    }

    /* Read More / Read Less button */
    .cos-intro-toggle {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        margin-top: 10px;
        padding: 6px 0;
        border: none;
        background: transparent;
        color: #008080;
        font-size: 14px;
        font-weight: 700;
        cursor: pointer
    }

    .cos-intro-toggle:hover {
        color: #3dbbbb
    }

    .cos-intro-toggle:focus-visible {
        outline: 2px solid #008080;
        outline-offset: 3px
    }
}

/* Desktop - show all content */
@media (min-width: 701px) {

    .cos-os-intro-copy .cos-intro-text {
        max-height: none !important;
        overflow: visible !important
    }

    .cos-intro-toggle {
        display: none !important
    }

}

/* ==========================================
   COS - GLOBAL CATEGORY LOADER
========================================== */

#cos-page-loader {
    position: fixed;
    inset: 0;
    z-index: 999999;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,.97);
    padding: 24px
}

#cos-page-loader.cos-loading {
    display: flex
}

.cos-loader-content {
    text-align: center;
    max-width: 320px
}

.cos-loader-spinner {
    width: 46px;
    height: 46px;
    margin: 0 auto 22px;
    border: 4px solid #d9eeee;
    border-top-color: #008080;
    border-radius: 50%;
    animation: cos-loader-spin .8s linear infinite
}

.cos-loader-title {
    color: #10231d;
    font-size: 21px;
    font-weight: 700;
    margin-bottom: 10px
}

.cos-loader-message {
    color: #6b7773;
    font-size: 14px;
    line-height: 1.5
}

@keyframes cos-loader-spin {
    to { transform: rotate(360deg) }
}

@media (prefers-reduced-motion: reduce) {
    .cos-loader-spinner {
        animation: none
    }
}

/* ==========================================
   COS - HIDE PRODUCT BADGES ON MOBILE
========================================== */

@media (max-width: 767px) {

    /* Hide original badges over product image */
    body.ex-product .catalog-single .badges-wrapper {
        display: none !important
    }

    /* Hide additional badges below gallery */
    body.ex-product .catalog-single .pdp-badge-details {
        display: none !important
    }

}

/* ==========================================
   COS - MOBILE PRODUCT PRICING
========================================== */

@media (max-width: 767px) {

    /* Main product price */
    body.ex-product .catalog-single .price {
        font-size: 30px !important;
        margin-top: 12px !important;
        margin-bottom: 4px !important;
        padding: 0 !important;
        line-height: 1.2
    }

    /* Including VAT label */
    body.ex-product
    .catalog-single
    .price-label-inc-vat {
        font-size: 14px !important;
        font-weight: 600;
        margin-right: 5px
    }

    /* RRP information */
    body.ex-product
    .catalog-single
    .product-shopping-actions-prices
    .product-price-rrp {
        font-size: 11px !important;
        margin-top: 4px !important;
        margin-bottom: 6px !important
    }

}

/* ==========================================
   COS - MOBILE PRODUCT QUANTITY SELECTOR
========================================== */

@media (max-width: 767px) {

    /* Quantity selector spacing */
    body.ex-product
    .catalog-single
    .buttons .qnt-count {
        padding-top: 0 !important;
        padding-bottom: 10px !important
    }

    /* Plus and minus buttons */
    body.ex-product
    .catalog-single
    .product-shopping-actions
    .buttons.group
    .qnt-count
    .incr-btn {
        width: 42px !important;
        height: 44px !important;
        line-height: 44px !important;
        font-size: 18px !important;
        background-color: #e6e6e6;
        color: #454545
    }

    /* Quantity input */
    body.ex-product
    .catalog-single
    .product-shopping-actions
    .buttons.group
    .qnt-count
    .inputquantity {
        width: 52px !important;
        height: 44px !important;
        font-size: 16px !important;
        margin: 0 !important;
        padding: 0 4px !important;
        text-align: center;
        box-sizing: border-box
    }

}

/* ==========================================
   COS - MOBILE PRODUCT BUY NOW BUTTON
========================================== */

@media (max-width: 767px) {

    /* Main Buy Now button */
    body.ex-product
    .catalog-single
    button#addItemToCart {
        width: 100% !important;
        min-height: 46px !important;
        padding: 11px 18px !important;
        margin: 0 !important;

        background-color: #008080 !important;
        color: #fff !important;

        border-radius: 5px !important;
        font-size: 15px !important;
        font-weight: 600 !important;
        line-height: 1.4 !important;

        box-sizing: border-box
    }

    /* Purchase button container */
    body.ex-product
    .catalog-single
    .product-shopping-actions-addtocart {
        width: 100%;
        margin-bottom: 10px
    }

}

/* ==========================================
   COS - MOBILE PRODUCT TITLE
========================================== */

@media (max-width: 767px) {

    /* Product title spacing */
    body.ex-product .catalog-single h1 {
        padding-top: 6px !important;
        margin-top: 0;
        margin-bottom: 10px
    }

    /* Product name */
    body.ex-product
    .catalog-single
    .product-title
    .product-name {
        font-family: "Montserrat", sans-serif !important;
        font-size: 16px !important;
        font-weight: 600;
        line-height: 1.4 !important;
        letter-spacing: 0;
        color: #454545;
        text-transform: uppercase
    }

}

/* ==========================================
   COS - MOBILE PRODUCT TITLE ABOVE IMAGE
========================================== */

/* Hidden on desktop */
body.ex-product .cos-mobile-product-title {
    display: none
}

@media (max-width: 767px) {

    body.ex-product .cos-mobile-product-title {
        display: block;
        width: 100%;
        box-sizing: border-box;

        padding: 12px 15px;
        margin-bottom: 4px;

        font-family: "Montserrat", sans-serif;
        font-size: 14px;
        font-weight: 600;
        line-height: 1.45;
        text-transform: uppercase;
        text-align: center;

        color: #454545;
        background: #f2f9f9;
        border-radius: 5px
    }

}
/* ==========================================
   COS - HIDE ORIGINAL PRODUCT TITLE ON MOBILE
========================================== */

@media (max-width: 767px) {

    body.ex-product
    .catalog-single
    .product-title
    .product-name {
        display: none !important
    }

}

/* ==========================================
   COS - HIDE COMPARE & QUICK LIST ON MOBILE
========================================== */

@media (max-width: 767px) {

    body.ex-product .catalog-single
    .product-shopping-actions .product-compare-action,

    body.ex-product .catalog-single
    .product-shopping-actions .product-shopping-actions-addtoquicklist,

    body.ex-product .catalog-single
    .product-shopping-actions-addtoquicklist a {
        display: none !important
    }

}

/* ==========================================
   COS - MOBILE BASKET PRODUCT LAYOUT
========================================== */

@media (max-width: 767px) {

    /* Product row */
    .shopping-cart table.items-list tr.item {
        display: grid !important;
        grid-template-columns: 100px minmax(0, 1fr);
        column-gap: 14px;
        row-gap: 6px;

        padding: 12px !important;
        margin-bottom: 12px;

        border: 1px solid #e5eaea;
        border-radius: 8px;
        background: #ffffff;

        box-sizing: border-box
    }

    /* Product image - left column */
    .shopping-cart table.items-list tr.item td.thumb {
        grid-column: 1;
        grid-row: 1 / span 3;

        width: 100% !important;
        min-width: 0 !important;
        padding: 0 !important;

        text-align: center;
        align-self: start
    }

    .shopping-cart table.items-list tr.item td.thumb img {
        display: block;
        width: 100%;
        max-width: 100px;
        height: auto;
        object-fit: contain
    }

    /* Product name - right column */
    .shopping-cart table.items-list tr.item td.name {
        grid-column: 2;
        grid-row: 1;

        width: 100% !important;
        padding: 0 !important;

        font-size: 13px;
        line-height: 1.4;
        text-align: left;
        min-width: 0
    }

    /* Unit price */
    .shopping-cart table.items-list tr.item td.price {
        grid-column: 2;
        grid-row: 2;

        width: 100% !important;
        padding: 0 !important;
        text-align: left
    }

    /* Line total */
    .shopping-cart table.items-list tr.item td.total {
        grid-column: 2;
        grid-row: 3;

        width: 100% !important;
        padding: 0 !important;
        text-align: left
    }

    /* Quantity selector */
    .shopping-cart table.items-list tr.item td.qnt-count {
        grid-column: 1;
        grid-row: 4;

        width: 100% !important;
        padding: 8px 0 0 !important;
        text-align: left
    }

    /* Remove button */
    .shopping-cart table.items-list tr.item td.delete {
        grid-column: 2;
        grid-row: 4;

        width: 100% !important;
        padding: 8px 0 0 !important;
        text-align: right;
        align-self: center
    }

}

/* ==========================================
   COS - MOBILE BASKET FINAL ALIGNMENT
========================================== */

@media (max-width: 767px) {

    /* Tighten product card spacing */
    .shopping-cart table.items-list tr.item {
        row-gap: 4px !important;
        column-gap: 12px !important;
        align-items: start
    }

    /* Quantity controls */
    .shopping-cart table.items-list tr.item td.qnt-count {
        grid-column: 1;
        grid-row: 4;
        width: auto !important;
        min-width: 0;
        padding: 6px 0 0 !important;
        align-self: center
    }

    /* Remove button container */
    .shopping-cart table.items-list tr.item td.delete {
        grid-column: 2;
        grid-row: 4;
        width: 100% !important;
        min-width: 0 !important;
        padding: 6px 0 0 !important;
        text-align: right;
        align-self: center;
        box-sizing: border-box
    }

    /* Prevent Remove button extending outside card */
    .shopping-cart table.items-list tr.item td.delete a,
    .shopping-cart table.items-list tr.item td.delete button {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: auto !important;
        max-width: 100% !important;
        min-width: 0 !important;
        padding: 7px 12px !important;
        margin: 0 !important;
        box-sizing: border-box;
        white-space: nowrap
    }

}

/* ==========================================
   COS - MOBILE BASKET SUMMARY POSITION
========================================== */

@media (max-width: 767px) {

    .shopping-cart .cart-resume {
        float: none !important;
        display: block;
        width: 100%;
        max-width: 100%;
        margin: 15px 0;
        box-sizing: border-box
    }

}

.listtools:not(.listtoolsbottom) {
    gap: 10px 0;
    display: flex;
    justify-content: space-between;
    align-items: center
}

.listtools:not(.listtoolsbottom)>div {
    width: auto
}

@media only screen and (max-width: 768px) {
    .listtools .itemsfound {
     font-size: 15px
    }
}

.listtools:not(.listtoolsbottom) .col-xs-4 {
    display: flex;
    gap: 20px 50px;
    align-items: center;
    justify-content: space-between
}

footer {
    padding: 0;
    background: #008080
}

/* ==========================================
   COUNTY OFFICE SUPPLIES
   MODERN PRODUCT BADGES
   COMPLETE RESPONSIVE CSS
========================================== */

/* ==========================================
   1. BADGE CONTAINER
========================================== */

.badges-wrapper {
    position: absolute;
    top: 10px;
    left: 10px;
    width: calc(100% - 20px);
    z-index: 5;

    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    align-content: flex-start;
    gap: 6px;

    pointer-events: none
}

/* ==========================================
   2. RIBBON WRAPPER
========================================== */

.ribbon-wrapper {
    position: relative;
    clear: none;
    float: none;

    top: auto;
    left: auto;

    flex: 0 0 auto;
    width: auto;
    max-width: 100%;

    margin: 0;
    padding: 0;
    z-index: 5
}

/* ==========================================
   3. MODERN BADGE DESIGN
========================================== */

.ribbon-wrapper .ribbon {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;

    float: none;
    box-sizing: border-box;

    width: auto;
    max-width: 100%;

    margin: 0;
    padding: 5px 10px;

    font-size: 11px;
    font-weight: 500;
    line-height: 1.4;
    letter-spacing: .1px;

    /* Left border matches EVO text colour */
    border-left: 3px solid currentColor;

    /* Modern rounded corners */
    border-radius: 0px;

    /* Keep all badge text on one line */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;

    text-align: left;
    box-shadow: none;
    cursor: default
}

/* ==========================================
   4. REMOVE OLD RIBBON EFFECTS
========================================== */

.ribbon-wrapper .ribbon-side,
.ribbon-wrapper .ribbon-tips {
    display: none !important
}

/* ==========================================
   5. MAXIMUM TWO VISIBLE BADGES
========================================== */

.badges-wrapper > .ribbon-wrapper:nth-child(n+3) {
    display: none !important
}

/* ==========================================
   6. TABLET
========================================== */

@media only screen and (max-width: 991px) {

    .badges-wrapper {
        top: 8px;
        left: 8px;
        width: calc(100% - 16px);
        gap: 6px
    }

    .ribbon-wrapper .ribbon {
        font-size: 11px;
        padding: 5px 9px;
        border-radius: 4px
    }

}

/* ==========================================
   7. MOBILE
========================================== */

@media only screen and (max-width: 575px) {

    .badges-wrapper {
        top: 8px;
        left: 8px;
        width: calc(100% - 16px);
        gap: 5px
    }

    .ribbon-wrapper {
        flex: 0 0 auto;
        width: auto;
        max-width: 100%
    }

    .ribbon-wrapper .ribbon {
        font-size: 12px;
        font-weight: 500;
        line-height: 1.4;

        padding: 5px 8px;

        border-left-width: 3px;
        border-radius: 4px;

        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;

        text-align: left
    } }

.label-danger {
display: none
}

.label.save {
display: none
}

.merchandising-content-static .badges-wrapper, .owl-item .badges-wrapper {
left: 10px
}

/* Hide unwanted duplicate pop-out menu trigger in footer */
footer #openMenu {
    display: none !important
}


/* ================================================
   COUNTY OFFICE SUPPLIES
   ACCOUNT DROPDOWN 
================================================ */


/* ================================================
   1. DROPDOWN CONTAINER
================================================ */

#shoppingtools_223846
.dropdown-menu.account-dropdown {
    width: 490px;
    min-width: 0;
    max-width: calc(100vw - 24px);
    padding: 14px;
    margin-top: 6px;
    background: #ffffff;
    border: 1px solid #e5e9ed;
    border-radius: 14px;
    box-shadow: 0 12px 35px rgba(0, 40, 40, 0.12);
    box-sizing: border-box;
}


/* ================================================
   2. MAIN TWO-COLUMN LAYOUT
================================================ */

#shoppingtools_223846 .cos-account-dropdown {
    display: grid;
    grid-template-columns: 1fr 1.12fr;
    gap: 16px;
    align-items: stretch;
}


/* ================================================
   3. LEFT BENEFITS SECTION
================================================ */

#shoppingtools_223846 .cos-account-benefits {
    padding: 6px 14px 4px 2px;
    border-right: 1px solid #e5e9ed;
}

#shoppingtools_223846 .cos-account-benefits h3 {
    margin: 0 0 14px;
    color: #1d2939;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.35;
    text-transform: none;
}

#shoppingtools_223846 .cos-account-benefits ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

#shoppingtools_223846 .cos-account-benefits li {
    position: relative;
    margin: 0 0 12px;
    padding: 0 0 0 20px;
    color: #344054;
    font-size: 11px;
    line-height: 1.6;
    list-style: none;
    background: none;
}

/* Teal tick */

#shoppingtools_223846 .cos-account-benefits li::before {
    content: "✓";
    position: absolute;
    top: -1px;
    left: 0;
    color: #008080;
    font-size: 14px;
    font-weight: 700;
}

#shoppingtools_223846 .cos-account-benefits li:last-child {
    margin-bottom: 0;
}


/* ================================================
   4. RIGHT ACCOUNT ACTIONS
================================================ */

#shoppingtools_223846 .cos-account-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* Shared button/card styling */

#shoppingtools_223846 .cos-account-action {
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    min-height: 59px;
    padding: 10px 12px;
    border-radius: 9px;
    box-sizing: border-box;
    text-decoration: none;
    transition:
        background-color 0.2s ease,
        border-color 0.2s ease;
}

#shoppingtools_223846 .cos-account-action strong {
    display: block;
    margin-bottom: 2px;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.3;
}

#shoppingtools_223846 .cos-account-action span {
    display: block;
    font-size: 12px;
    line-height: 1.35;
    margin-left: 0px;
}


/* ================================================
   5. SIGN IN
================================================ */

#shoppingtools_223846 .cos-account-signin {
    background: #008080;
    border: 1px solid #008080;
    color: #ffffff;
}

#shoppingtools_223846 .cos-account-signin strong,
#shoppingtools_223846 .cos-account-signin span {
    color: #ffffff;
}

#shoppingtools_223846 .cos-account-signin:hover,
#shoppingtools_223846 .cos-account-signin:focus {
    background: #006666;
    border-color: #006666;
    color: #ffffff;
}


/* ================================================
   6. USER REGISTRATION
================================================ */

#shoppingtools_223846 .cos-account-register {
    background: #ffffff;
    border: 1px solid #008080;
    color: #006666;
}

#shoppingtools_223846 .cos-account-register strong {
    color: #006666;
}

#shoppingtools_223846 .cos-account-register span {
    color: #567878;
}

#shoppingtools_223846 .cos-account-register:hover,
#shoppingtools_223846 .cos-account-register:focus {
    background: #f0fafa;
    color: #006666;
}


/* ================================================
   7. CREDIT ACCOUNT
================================================ */

#shoppingtools_223846 .cos-account-credit {
    background: #e6f5f5;
    border: 1px solid #e6f5f5;
    color: #006666;
}

#shoppingtools_223846 .cos-account-credit strong {
    color: #006666;
}

#shoppingtools_223846 .cos-account-credit span {
    color: #567878;
}

#shoppingtools_223846 .cos-account-credit:hover,
#shoppingtools_223846 .cos-account-credit:focus {
    background: #d4eeee;
    border-color: #008080;
    color: #006666;
}


/* ================================================
   8. ACCESSIBILITY
================================================ */

#shoppingtools_223846 .cos-account-action:focus-visible {
    outline: 2px solid #008080;
    outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
    #shoppingtools_223846 .cos-account-action {
        transition: none;
    }
}


/* ================================================
   9. TABLET / SMALLER DESKTOP
================================================ */

@media only screen and (max-width: 768px) {

    #shoppingtools_223846
    .dropdown-menu.account-dropdown {
        width: 450px;
        max-width: calc(100vw - 24px);
        padding: 12px;
    }

    #shoppingtools_223846 .cos-account-dropdown {
        gap: 12px;
    }

    #shoppingtools_223846 .cos-account-benefits {
        padding-right: 12px;
    }

}


/* ================================================
   10. MOBILE
================================================ */

@media only screen and (max-width: 500px) {

    #shoppingtools_223846
    .dropdown-menu.account-dropdown {
        width: 320px;
        max-width: calc(100vw - 20px);
        padding: 12px;
    }

    #shoppingtools_223846 .cos-account-dropdown {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    #shoppingtools_223846 .cos-account-benefits {
        padding: 0 0 12px;
        border-right: none;
        border-bottom: 1px solid #e5e9ed;
    }

    #shoppingtools_223846 .cos-account-benefits h3 {
        margin-bottom: 10px;
    }

    #shoppingtools_223846 .cos-account-benefits li {
        margin-bottom: 7px;
    }

    #shoppingtools_223846 .cos-account-actions {
        gap: 8px;
    }

    #shoppingtools_223846 .cos-account-action {
        min-height: 54px;
        padding: 9px 12px;
    }

}


/* ==========================================
   COS ACCOUNT DROPDOWN
   HOVER GAP FIX
========================================== */

/* Invisible hover bridge above dropdown */
#shoppingtools_223846
.dropdown-menu.account-dropdown::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: -12px;
    height: 12px;
    background: transparent;
    pointer-events: auto;
}


/* ================================================
   COUNTY OFFICE SUPPLIES
   ACCOUNT DROPDOWN - END
================================================ */

/* =========================================================
   COUNTY OFFICE SUPPLIES
   NEW FOOTER 2026
========================================================= */


/* =========================================================
   BASE
========================================================= */

.cos2026-footer {
    width: 100%;
    margin: 0;
    padding: 0;

    background: #10231d;
    color: #c3d1cc;

    font-family: 'Montserrat', Arial, sans-serif;
    text-align: left;
}

.cos2026-footer,
.cos2026-footer * {
    box-sizing: border-box;
}

.cos2026-footer a {
    text-decoration: none;
}

.cos2026-container {
    width: 92%;
    max-width: 1420px;
    margin: 0 auto;
}


/* =========================================================
   DESKTOP SUPPORT / BENEFITS STRIP
========================================================= */

.cos2026-support {
    width: 100%;

    background: #e1f6f5;
    color: #10231d;
}

.cos2026-support-grid {
    display: grid;

    grid-template-columns:
        repeat(4, minmax(0, 1fr));

    align-items: stretch;

    padding: 0;
}


/* =========================================================
   SUPPORT ITEM
========================================================= */

.cos2026-support-item {
    position: relative;

    display: flex;
    align-items: center;

    min-width: 0;
    min-height: 108px;

    gap: 18px;

    padding: 20px 28px;

    color: #10231d;

    border-left: 1px solid #c3dfdd;

    transition:
        background-color .2s ease,
        color .2s ease;
}

.cos2026-support-item:first-child {
    border-left: 0;
}

.cos2026-support-item:hover {
    background: #d6f0ef;
}


/* =========================================================
   SUPPORT ICON
========================================================= */

.cos2026-support-icon {
    display: flex;

    flex: 0 0 48px;

    align-items: center;
    justify-content: center;

    width: 48px;
    height: 48px;
}

.cos2026-support-icon img {
    display: block;

    width: 44px;
    height: 44px;

    max-width: 100%;

    object-fit: contain;
}


/* =========================================================
   SUPPORT TEXT
========================================================= */

.cos2026-support-text {
    flex: 1 1 auto;

    min-width: 0;
}

.cos2026-support-text strong {
    display: block;

    margin: 0;

    color: #10231d;

    font-size: 14px;
    font-weight: 700;
    line-height: 1.35;
}

.cos2026-support-text small {
    display: block;
    margin-top: 5px;
    color: #52635e;
    margin-left: 0px;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.45;
}


/* =========================================================
   SUPPORT ARROW
========================================================= */

.cos2026-support-arrow {
    flex: 0 0 auto;

    margin-left: auto;

    color: #008080;

    font-size: 28px;
    font-weight: 300;
    line-height: 1;

    transition: transform .2s ease;
}

.cos2026-support-item:hover
.cos2026-support-arrow {
    transform: translateX(3px);
}


/* =========================================================
   MAIN FOOTER
========================================================= */

.cos2026-main {
    width: 100%;

    background: #10231d;
}

.cos2026-grid {
    display: grid;

    grid-template-columns:
        minmax(150px, .9fr)
        minmax(250px, 1.45fr)
        minmax(190px, 1.1fr)
        minmax(210px, 1.15fr)
        minmax(240px, 1.35fr);

    gap: 34px;

    align-items: start;

    padding-top: 44px;
    padding-bottom: 48px;
}


/* =========================================================
   MOBILE ACTION BAR
   HIDDEN ON DESKTOP
========================================================= */

.cos2026-mobile-actions {
    display: none;
}


/* =========================================================
   DESKTOP HEADINGS
========================================================= */

.cos2026-heading {
    width: 100%;

    margin: 0 0 20px;
    padding: 0;

    border: 0;

    background: transparent;

    color: #ffffff;

    font-family: inherit;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.4;

    text-align: left;

    cursor: default;
}

.cos2026-chevron {
    display: none;
}


/* =========================================================
   DESKTOP LINK LISTS
========================================================= */

.cos2026-links {
    margin: 0;
    padding: 0;

    list-style: none;
}

.cos2026-links li {
    margin: 0;
    padding: 0;

    list-style: none;
}

.cos2026-links li + li {
    margin-top: 10px;
}

.cos2026-links a {
    display: inline-block;

    color: #c3d1cc;

    font-size: 13px;
    font-weight: 400;
    line-height: 1.55;

    transition:
        color .2s ease,
        transform .2s ease;
}

.cos2026-links a:hover {
    color: #ffffff;

    transform: translateX(2px);
}


/* =========================================================
   BULK ORDER MODAL TRIGGER
========================================================= */

.cos2026-footer .bulk-order-trigger {
    display: inline-block;

    margin: 0;
    padding: 0;

    border: 0;
    border-radius: 0;

    background: transparent;
    box-shadow: none;

    color: #c3d1cc;

    font-family: inherit;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.55;

    text-align: left;
    text-transform: none;

    cursor: pointer;

    appearance: none;
    -webkit-appearance: none;

    transition:
        color .2s ease,
        transform .2s ease;
}

.cos2026-footer
.bulk-order-trigger:hover {
    color: #ffffff;

    background: transparent;

    transform: translateX(2px);
}

.cos2026-footer
.bulk-order-trigger:active,
.cos2026-footer
.bulk-order-trigger:focus {
    background: transparent;
}


/* =========================================================
   CONTACT COLUMN
========================================================= */

.cos2026-contact {
    padding-left: 30px;

    border-left:
        1px solid rgba(255, 255, 255, .14);
}


/* =========================================================
   CONTACT TAGLINE
========================================================= */

.cos2026-tagline {
    margin: 0 0 18px;
    padding: 0;

    color: #ffffff;

    font-size: 24px;
    font-weight: 700;
    line-height: 1.25;

    letter-spacing: -.4px;
}


/* =========================================================
   TELEPHONE
========================================================= */

.cos2026-phone {
    display: inline-block;

    margin: 0 0 7px;

    color: #ffffff;

    font-size: 23px;
    font-weight: 700;
    line-height: 1.4;

    transition: color .2s ease;
}

.cos2026-phone:hover {
    color: #b2dfdb;
}


/* =========================================================
   CONTACT LINKS
========================================================= */

.cos2026-contact-links {
    display: flex;

    flex-direction: column;

    align-items: flex-start;

    gap: 16px;

    margin-top: 10px;
}

.cos2026-contact-links a {
    display: flex;

    align-items: center;

    gap: 14px;

    color: #c3d1cc;

    font-size: 13px;
    font-weight: 400;
    line-height: 1.5;

    transition: color .2s ease;
}

.cos2026-contact-links a:hover {
    color: #ffffff;
}


/* =========================================================
   CONTACT ICONS
========================================================= */

.cos2026-contact-icon {
    flex: 0 0 auto;

    width: 27px;
    height: 27px;

    fill: none;

    stroke: #45d7d7;

    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.cos2026-contact-links a:hover
.cos2026-contact-icon {
    stroke: #ffffff;
}


/* =========================================================
   ADDRESS
========================================================= */

.cos2026-address {
    margin: 22px 0 0;
    padding: 0;

    color: #c3d1cc;

    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.8;
}


/* =========================================================
   ACCESSIBILITY
========================================================= */

.cos2026-footer a:focus-visible,
.cos2026-heading:focus-visible,
.cos2026-footer
.bulk-order-trigger:focus-visible {
    outline: 2px solid #b2dfdb;

    outline-offset: 4px;

    border-radius: 2px;
}

.cos2026-support a:focus-visible {
    outline-color: #008080;
}


/* =========================================================
   SMALLER DESKTOP
   REMOVE OFFICE SUPPLIES FIRST
========================================================= */

@media screen and (max-width: 1200px) and (min-width: 769px) {

    .cos2026-support-grid {
        grid-template-columns:
            repeat(3, minmax(0, 1fr));
    }

    .cos2026-support-supplies {
        display: none;
    }

}


/* =========================================================
   SMALL TABLET / NARROW DESKTOP
   REMOVE OFFICE FURNITURE NEXT
========================================================= */

@media screen and (max-width: 950px) and (min-width: 769px) {

    .cos2026-support-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }

    .cos2026-support-furniture {
        display: none;
    }

}


/* =========================================================
   MEDIUM DESKTOP FOOTER
========================================================= */

@media screen and (min-width: 769px) and (max-width: 1199px) {

    .cos2026-container {
        width: 94%;
    }

    .cos2026-grid {
        grid-template-columns:
            minmax(120px, .8fr)
            minmax(210px, 1.35fr)
            minmax(165px, 1fr)
            minmax(175px, 1fr)
            minmax(205px, 1.2fr);

        gap: 22px;
    }

    .cos2026-contact {
        padding-left: 22px;
    }

    .cos2026-tagline {
        font-size: 21px;
    }

    .cos2026-phone {
        font-size: 20px;
    }

    .cos2026-links a,
    .cos2026-footer .bulk-order-trigger,
    .cos2026-address {
        font-size: 12px;
    }

}


/* =========================================================
   MOBILE
========================================================= */

@media screen and (max-width: 768px) {


    /* =====================================================
       CONTAINER
    ====================================================== */

    .cos2026-container {
        width: 100%;
        max-width: none;

        margin: 0;
    }


    /* =====================================================
       HIDE DESKTOP SUPPORT STRIP
    ====================================================== */

    .cos2026-support {
        display: none;
    }


    /* =====================================================
       MAIN FOOTER
    ====================================================== */

    .cos2026-grid {
        display: block;

        width: 100%;

        padding:
            0
            18px
            28px;
    }


    /* =====================================================
       MOBILE ACTION BAR
    ====================================================== */

    .cos2026-mobile-actions {
        display: grid;

        grid-template-columns:
            repeat(4, minmax(0, 1fr));

        width: calc(100% + 36px);

        margin:
            0
            -18px
            16px;

        padding: 0;

        background: #e1f6f5;
    }


    /* =====================================================
       MOBILE ACTION
    ====================================================== */

    .cos2026-mobile-action {
        position: relative;

        display: flex;

        flex-direction: column;

        align-items: center;
        justify-content: center;

        min-width: 0;
        min-height: 92px;

        gap: 7px;

        padding:
            13px
            5px
            12px;

        color: #10231d;

        text-align: center;

        border-left:
            1px solid #c3dfdd;

        transition:
            background-color .2s ease,
            color .2s ease;
    }

    .cos2026-mobile-action:first-child {
        border-left: 0;
    }

    .cos2026-mobile-action:hover {
        color: #008080;

        background: #d6f0ef;
    }


    /* =====================================================
       MOBILE ACTION ICON
    ====================================================== */

    .cos2026-mobile-action svg {
        width: 30px;
        height: 30px;

        fill: none;

        stroke: #008080;

        stroke-width: 1.6;
        stroke-linecap: round;
        stroke-linejoin: round;
    }


    /* =====================================================
       MOBILE ACTION TEXT
    ====================================================== */

    .cos2026-mobile-action span {
        display: block;

        color: inherit;

        font-size: 11px;
        font-weight: 600;
        line-height: 1.25;
    }


    /* =====================================================
       MOBILE ACCORDION GROUPS
    ====================================================== */

    .cos2026-group {
        width: 100%;

        border-bottom:
            1px solid rgba(255, 255, 255, .14);
    }


    /* =====================================================
       MOBILE ACCORDION HEADINGS
    ====================================================== */

    .cos2026-heading {
        display: flex;

        align-items: center;
        justify-content: space-between;

        width: 100%;

        margin: 0;

        padding: 15px 10px;

        color: #ffffff;

        background: transparent;

        border: 0;

        font-family: inherit;
        font-size: 14px;
        font-weight: 700;
        line-height: 1.4;

        text-align: left;

        cursor: pointer;
    }


    /* =====================================================
       MOBILE CHEVRON
    ====================================================== */

    .cos2026-chevron {
        display: block;

        flex: 0 0 auto;

        width: 11px;
        height: 11px;

        margin-right: 4px;

        border-right:
            2px solid #3dbbbb;

        border-bottom:
            2px solid #3dbbbb;

        transform: rotate(45deg);

        transition:
            transform .25s ease;
    }

    .cos2026-group.is-open
    .cos2026-chevron {
        transform: rotate(225deg);
    }


    /* =====================================================
       MOBILE ACCORDION PANEL
    ====================================================== */

    .cos2026-panel {
        max-height: 0;

        overflow: hidden;

        opacity: 0;

        transition:
            max-height .35s ease,
            opacity .25s ease;
    }

    .cos2026-group.is-open
    .cos2026-panel {
        max-height: 800px;

        opacity: 1;
    }


    /* =====================================================
       MOBILE TWO-COLUMN LINKS
    ====================================================== */

    .cos2026-links {
        display: grid;

        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        column-gap: 24px;
        row-gap: 0;

        margin: 0;

        padding:
            4px
            12px
            18px;

        list-style: none;
    }

    .cos2026-links li,
    .cos2026-links li + li {
        min-width: 0;

        margin: 0;
        padding: 0;

        list-style: none;
    }

    .cos2026-links a {
        display: block;

        width: 100%;

        padding: 9px 0;

        color: #c3d1cc;

        font-size: 13px;
        font-weight: 400;
        line-height: 1.45;

        text-align: left;

        transition: color .2s ease;
    }

    .cos2026-links a:hover {
        color: #ffffff;

        transform: none;
    }


    /* =====================================================
       MOBILE BULK ORDER BUTTON
    ====================================================== */

    .cos2026-footer
    .bulk-order-trigger {
        display: block;

        width: 100%;

        margin: 0;
        padding: 9px 0;

        border: 0;
        border-radius: 0;

        background: transparent;
        box-shadow: none;

        color: #c3d1cc;

        font-family: inherit;
        font-size: 13px;
        font-weight: 400;
        line-height: 1.45;

        text-align: left;
        text-transform: none;

        cursor: pointer;

        appearance: none;
        -webkit-appearance: none;

        transition: color .2s ease;
    }

    .cos2026-footer
    .bulk-order-trigger:hover {
        color: #ffffff;

        background: transparent;

        transform: none;
    }


    /* =====================================================
       MOBILE CONTACT AREA
    ====================================================== */

    .cos2026-contact {
        margin-top: 26px;

        padding:
            25px
            10px
            0;

        border-left: 0;

        border-top:
            1px solid rgba(255, 255, 255, .14);
    }


    /* =====================================================
       MOBILE TAGLINE
    ====================================================== */

    .cos2026-tagline {
        margin-bottom: 14px;

        font-size: 21px;
    }


    /* =====================================================
       MOBILE PHONE
    ====================================================== */

    .cos2026-phone {
        font-size: 20px;
    }


    /* =====================================================
       MOBILE CONTACT LINKS
    ====================================================== */

    .cos2026-contact-links a {
        font-size: 13px;
    }


    /* =====================================================
       MOBILE ADDRESS
    ====================================================== */

    .cos2026-address {
        margin-top: 18px;

        font-size: 12px;
    }

}


/* =========================================================
   VERY SMALL MOBILE
========================================================= */

@media screen and (max-width: 380px) {

    .cos2026-mobile-action {
        min-height: 86px;

        padding:
            12px
            3px
            10px;
    }

    .cos2026-mobile-action svg {
        width: 27px;
        height: 27px;
    }

    .cos2026-mobile-action span {
        font-size: 10px;
    }

    .cos2026-links {
        column-gap: 18px;

        padding-left: 8px;
        padding-right: 8px;
    }

}

footer .footersection-2 {
padding: 0;
}
/* =========================================================
   COUNTY OFFICE SUPPLIES
   NEW FOOTER 2026 - end
========================================================= */